CSS Fixes

Previously, you needed to include style fixes for Internet Explorer through multiple conditional comments. With the new template, you no longer need to juggle multiple conditionals or manage multiple style sheets. All of the necessary conditionals have been set up for you, which you can now access simply using preset classes.

Table: Showing which IE browser will recognize which classes
Version: IE 5.5 IE 6 IE 7 IE 8 IE 9 IE 10
Version: IE 5.5 IE 6 IE 7 IE 8 IE 9 IE 10
lt-ie7 yes no
ie7 no yes no
lt-ie8 yes no
ie8 no yes no
lt-ie9 yes no
lte-ie9 yes no
ie9 no yes no

So how do I use this?

Let's say you have a green background that needs to show in red in any Internet Explorer browser under version 8, but yellow in 8 & 9:

	div {background:green;}
	.lte-ie9 div {background:yellow;}
	.lt-ie8 div {background:red;}

That's it. No need to write conditionals or manage multiple style sheets - you just write a different rule prefixed with a class and the template takes care of the rest. An advantage here is maintaining one clear picture of how the cascade is working so you don't need to remember that IE-specific fixes are present for one of your rules in a different file when it comes time to change things.

Note: IE 10 is still in development at the time of this template release, so it does not have conditionals which allow targeting of that version yet.