We were discussing the CSS3 grid layout module in the Clearleft office today, so naturally Rachel’s name came up. This is such a great resource for diving into this stuff.
Jake demonstrates his technique for preprocessor-generated stylesheets for older versions of Internet Explorer (while other browsers get the same styles within media queries).
A look at the new pseudo-classes in CSS3 that go hand-in-hand with the form enhancements introduced in HTML5.
A detailed overview by Filament Group on progressively enhancing navigation for responsive sites.
A really handy test site from Lea that reports your browser’s recognition of CSS properties.
Richard starts diving into some the nifty ligatures that are becoming available to us in OpenType fonts with CSS3.
This is really handy: a bookmarklet that will disable any CSS3 on a page so you can check that your fallbacks look okay.
Stephen gives an excellent run-down of flexbox and how you can use it today.
Joni points out a great advantage to the mobile-first approach if you choose not to polyfill for legacy versions of IE: you can go crazy with all sorts of CSS3 goodies in the stylesheet you pull in with media queries.
Most of these are pretty over the top but they’re good proofs of concept.
Here’s a geek advent calendar I missed. There are some great CSS techniques here.
An in-depth look at browser polyfills: what they are, how they work, and how you can make your own.
If you use Sass, this could be a really handy technique for handling IE<9 support with mobile-first responsive designs.
Lea documents a whole bunch of CSS animation possibilities.
#816: Revert mobile-first media queries and remove respond.js - Issues - h5bp/html5-boilerplate - GitHub
This thread on whether HTML5 Boilerplate should include Respond.js by default (and whether the CSS should take a small-screen first approach) nicely summarises the current landscape for web devs: chaotic, confusing …and very, very exciting.
A wonderfully in-depth article from Zoe on all the practical aspects of using media queries for layout.
This presentation from Lea contains some CSS gems (and it’s all delivered in HTML).
Mobile HTML5 - compatibility tables for iPhone, Android, BlackBerry, Symbian, iPad and other mobile devices
This just launched at the Breaking Development conference: another site that uses the term HTML5 to include CSS and Ajax. Still, despite its inaccurate nomenclature, it’s a useful compatibility table of device support in mobile browsers.
A look under the hood of the dConstruct website (including some nth-child selectors I threw in there).