CSS

TwitterFacebook
Get flash to fully experience Pearltrees

An Introduction To LESS, And Comparison To Sass - Smashing Magazine

http://coding.smashingmagazine.com/2011/09/09/an-introduction-to-less-and-comparison-to-sass/ I’ve been using LESS 1 religiously ever since I stumbled upon it months ago. CSS was never really a problem for me, in and of itself, but I was intrigued by the idea of using variables to create something along the lines of a color palette for my websites and themes. Having a color palette with a fixed number of options to choose from helps prevent me from going color crazy and deviating from a chosen style.

Stop Making Sprites (Compass, Sass, and PNG Sprite Generation) | Viget Inspire

http://viget.com/inspire/stop-making-sprites-compass-sass-and-png-sprite-generation Update 01/11/12: new code at the bottom of this post. Sass has been kicking around for a while, but I hadn’t given it a try until just recently. Sass usually goes hand-in-hand with Rails, Compass makes it so easy to run Sass on standalone projects that I’ve started using it on nearly everything.

Don’t use IDs in CSS selectors? ❧ Oli.jp (@boblet)

http://oli.jp/2011/ids/ Recently I came across the post by Matt Wilcox called CSS Lint is harmful , ranting about the useful free tool CSS Lint . The “Don’t use IDs in selectors” suggestion seems to have offended Matt the most, but I was surprised that many commenters also mentioned this as being a reason to avoid CSS Lint. This surprised me because smart people have been saying prefer classes to IDs for a while now. The article was light on reasons why this suggestion might be bad, but it boils down to:

The 30 CSS Selectors you Must Memorize | Nettuts+

Twice a month, we revisit some of our readers’ favorite posts from throughout the history of Nettuts+. This tutorial was first published in November, 2010. So you learned the base id , class , and descendant selectors – and then called it a day? If so, you’re missing out on an enormous level of flexibility. While many of the selectors mentioned in this article are part of the CSS3 spec, and are, consequently, only available in modern browsers, you owe it to yourself to commit these to memory. Let’s knock the obvious ones out, for the beginners, before we move onto the more advanced selectors. http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/

CSS3 Solutions for Internet Explorer - Smashing Magazine

Experienced developers understand that CSS3 can be added to new projects with progressive enhancement in mind . This ensures that content is accessible while non-supportive browsers fall back to a less-enhanced experience for the user. But developers could face a situation where a client insists that the enhancements work cross-browser , demanding support even for IE6. http://coding.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/
Sass

CSS - Contents and compatibility

http://www.quirksmode.org/css/contents.html IE 8-10 (and maybe older ones, too) have a slight bug: clicking the mouse down on a nested element does not trigger :active . Try it in the test page by depressing the mouse button on one of the code examples. The :active styles do not kick in. IE doesn’t react to the Back and Forward buttons: the element doesn’t apply or remove the pseudo-class at all.
The clearfix hack is a popular way to contain floats without resorting to using presentational markup. This article presents an update to the clearfix method that further reduces the amount of CSS required. The “micro clearfix” method is suitable for modern browsers and builds upon Thierry Koblentz’s “clearfix reloaded” , which introduced the use of both the :before and :after pseudo-elements. Including the :before selector is not necessary to clear the floats, but it prevents top-margins from collapsing in modern browsers. This ensures that there is visual consistency with IE 6/7 when zoom:1 is applied. However, there are circumstances in which IE 6/7 will not contain the bottom margins of floats within a new block formatting context.

A new micro clearfix hack – Nicolas Gallagher

http://nicolasgallagher.com/micro-clearfix-hack/
CSS3