SCSS — a new icing from Sass
- +2
- 22 June 2010, 18:37
- Tweet
- Add a comment
As I lately did almost no CSS/HTML jobs, I've missed the Sass3 release that implemented the SCSS extension (Sassy CSS). That's a CSS extension without any syntax «distortion», meaning that any valid CSS document is a valid SCSS document too. In this article, I'll compare that release with some existing preprocessors, such as and . Please note that the Sass syntax has been updated recently.
( Read more )
Our Solar System — An experiment with CSS3
- +3
- 01 June 2010, 17:40
- Tweet
- Add a comment
An experiment with CSS3 border-radius, transforms & animations. This is an attempt to recreate our solar system using CSS3 features such as border-radius, transforms and animations. The result is surprising and quite interesting.
( Read more )
Cross-browser box-shadow
- +1
- 31 May 2010, 14:27
- Tweet
- Add a comment
Hi, dear readers!
Today I'd like to share with you an extremely simple cross-browser implementation of the CSS property «box-shadow». The method is so simple and obvious that I was greatly surprised not to find a similar solution anywhere on the Web (though I'm absolutely positive that I'm not the first one to discover it).
( Read more )
35 Fresh CSS3 Articles & Tutorials
This is cool collection of most wanted, usefull tutorials and articles by CSS3. In this article you find out how make cool CSS3 Gradient Buttons, Sliding or bouncing Navigation without JavaScript, Slide effect menu with the Apple-Style and much more. Hope you like it. Thanks
( Read more )
Web design checklist - CSS3 Properties
- 0
- 26 March 2010, 04:19
- Tweet
- Add a comment
Getting a CSS rule's line number in Safari / WebKit / Chrome Web Inspector
- +1
- 22 March 2010, 06:23
- Tweet
- Add a comment
WebKit-based browsers have an excellent built-in tool for webpage debugging, Web Inspector. Basically, it's an analog of Firebug, with its own strengths and weaknesses. I've been using Web Inspector more and more lately, though one drawback bothered me a lot: It doesn't show line numbers of the CSS rules.
( Read more )
Improving text-align: justify
- +2
- 15 March 2010, 08:18
- Tweet
- Add a comment
They say that only amateurs justify text, and the reason is simple: huge gaps between words. Even if hyphenation is used, the result is still far from perfect:
( Read more )
( Read more )
To Copy or Not to Copy: The content CSS Property
- +8
- 10 February 2010, 07:42
- Tweet
- Add a comment
I've decided to use a trendy CSS property, content, for my web project, to make webpages more "lightweight" and to improve the flexibility of tuning their appearance. As the project was only intended for web developers, I didn't need to bother about supporting outdated browsers (IE 6 and 7). Alas, I was greatly disillusioned in that CSS property: though everything was displayed correctly, the end user's experience was far from perfect.
( Read more )
Uniform Text Background
In the last years, it has been trendy to use contrast background in the headings. For example, it looks like this:
Though the task looks pretty simple, it is not: if you think that all you need is to add some padding, that doesn't work because the indent is added only in the beginning and in the end of the text, and the text wrap is ignored.
( Read more )
Though the task looks pretty simple, it is not: if you think that all you need is to add some padding, that doesn't work because the indent is added only in the beginning and in the end of the text, and the text wrap is ignored.
( Read more )
Columnar Layout
There are many methods of making columnar layout. More than one web developer's nose was blooded (fortunately, only virtually) in the holy wars over the superiority of one or the other technique. It should seem that everything is as clear as possible by now, but plenty of difficulties still arise here and there. I'd like to make my contribution to the common good, so I've spent some time on experiments that allowed me to create one more method, which has the following advantages and disadvantages:
( Read more )