CSS Hacks for Internet Explorer

Internet Explorer is a curse to web developers. I wonder when will Microsoft close that franchise. As a developer its always a headache to fix the CSS proprieties whether its IE5,6,7,8 or 10 and so on. A simple CSS code which will work in every other browser will refuse to show its effects when it enters the Kingdom of IE. You always have to use CSS hacks for Internet Explorer.

CSS hacks for internet explorer

Lately, I have been searching for a lot of Fixes for CSS in IE and i will like to share them all with you here.

1. Include a CSS file only for IE:

Its the most common way, include a separate CSS file in your page just for Internet Explorer. You can even specify the Version for which you want to include the CSS file.

Use this code in your HTML page, the <!–[if IE]–> makes sure that the code is loaded only when the user is using IE. If you want to load a specific CSS file for a specific version of internet explorer then use this code in the following way.

Another amazing idea is to use the IE conditional comment to add specific class to the body tag, referring to that class, you can then select any child element and add CSS properties to it in just one file.

Now after adding that to your HTML page, you can easily control the proprieties for IE as follow:

2. Hack For inline CSS or for few CSS proprieties:

Sometimes, you might want to adjust a few properties or have to adjust an inline CSS. You may not want to increase the requests to your server by creating additional CSS files. So here is the hack for writing Internet Explorer specific CSS properties without loading the a new file.

Now that CSS looks pretty ugly and will not even get validated by W3C CSS validator, it will work.But honestly speaking, Who Cares?

3. Using Media Queries as CSS Hack for Internet Explorer:

Well, I will totally do not recommend these methods because it uses flaws in internet Explorer. IE will run an invalid media query as valid while other browsers will simply discard it. Thanks to Microsoft, there are different flaws in different versions and using them, you can target specific versions of Internet Explorer. Here we Go.
Target the older Versions i.e 6 and 7

So that was about fixing the Crap created by Microsoft. No offense intended (some should be taken though). But whenever I create a wonderful site and then see it on internet explorer, I get a mini heart attack. Fixing them is sometimes like creating some parts of the site from the scratch. Using CSS hacks for internet explorer is not a good practice which we all do because there is no other way. My last wish will be to see IE closed officially. According to the stats from w3schools, which are reliable in no way but are good to make your self apparently happy, Internet explorer’s market share are going down day by day.

Browsers-market-share

If you haven’t used Internet Explorer yet which I bet You would have then don’t be so lucky and download it here.

If you have any questions or want to share your thoughts, please let me know in comments. Alternatively, ask me on twitter or Facebook.

You May Also Like

Leave a Reply