mozilla/bedrock — pull request #1719 by craigcook (2014-02-20 20:12:36+00:00)
Title: Bug 869516 - base styles for older versions of IE

After burning a lot of time testing and tweaking a bunch of individual pages, I changed my approach and arrived at something much simpler by adding a new block in the base templates. The existing site_css block and the new page_css block are both hidden from old IEs but the extrahead block is not. This means most pages that already use extrahead to include page-specific styles continue to work as they have (since they've already been tested with old IEs).

Future pages that need page-specific styling can now use the page_css block to hide those styles from oldIE and you usually won't need to bother testing. Old IE gets the basic styling and doesn't see your new CSS at all. Use good markup and your content should degrade to something perfectly readable and presentable, just not fancy.

Note that the JavaScript blocks are NOT hidden from old IEs, in order to avoid breaking a lot of pages already built and tested for them. In the future, you can include conditional comments *inside* the site_js or js blocks to let old IE degrade without any fancy JS, but I didn't want to make that change global in the base templates (I tried it; lots of stuff broke).

Some pages might have content hidden in the page-specific CSS that is then made visible by JS when needed (stuff like modals and close buttons). If you're explicitly hiding elements in your page styles just remember that content will be visible in old IEs since they don't get your page-specific CSS. oldIE.less does include the same .hidden class from sandstone so you can still use that to visually hide content and it'll be hidden in IE as well.