Structuring And Serving Styles For Older Browsers | Sparkbox

June 30, 2013

css / design / progressive-enhancement / responsive design / sass

One way to accomplish this is by outputting two different stylesheets — one for browsers that support media queries and one for those that don’t. In other words, generate one stylesheet that contains media queries, and generate one that strips off the crunchy media query shell but leaves the creamy CSS center. In effect, this will apply all of our media queries, giving users of old browsers the “desktop‐size” experience they expect. Through the power of preprocessing, we’re able to generate these two stylesheets and only write the code once.