10 Dirty Internet Explorer CSS Hacks You Might Not know

Written by Kevin Liew on 15 Nov 2010
32,083 Views • Shares


Disclaimer: The intention of this article is not to encourage to apply this hack to your web projects but to understand what have been using by other web designers/developers. The best way to solve Internet Explorer's CSS layout issue is - create different style sheets for different versions of Internet explorers.

Alright, have ever found yourself in this situation, you were trying to update an existing old website, opened CSS file and you saw something that you think it's typo from previous CSS coder - but it's not. There was a CSS file I was trying to update and I saw some asterisks, underscores appear randomly as a prefix in some attributes. Did some search on Google and found out it's Internet explorer hacks!

So, the main purpose of this article, is not encourage you to use hacks, but to understand what hacks have been using by others so whenever you update someone else's project you can interpret the CSS file better. :) Alright, I have collected 10 of them start from IE8 to........ IE5.0!

1. IE 8

.color {color: #f00
Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

Elijah Manor 6 years ago
Nice, but hopefully I won't have to use ;) What are IE9 only and IE9 and below?
shani 5 years ago
hey there, did you get any answers for your question for css hack for ie9 only and ie9 and below?
Kevin Liew Admin 5 years ago
I will recommend IE Conditional Comments:
Vaibhav Gupta 6 years ago
impressive man... chrres :)
Jason 6 years ago
Good post, but how about an explanation of what these do or what they are.

Personally, I find using hacks to whip IE into shape are fine. It's a terrible browser that doesn't conform to standards and if I can limit the time it takes me to fix problems with it, I'll use hacks every time.
Chris 6 years ago
Is it just me, or are #6 and #8 exactly the same? They can't be both "IE 6 Only" and "IE 6 and below". Not that it really matters because there's pretty much no one out there using versions below 6 anymore.
Thoams 6 years ago
Great list !

I think there are two times the hack :
.box {
_background: #f00;

I recommand to use this other hack for IE8 and below :
.box {
background: #f009

Have a good day !
Maurizio Mangione 6 years ago
IMHO the best way to solve Internet Explorer's CSS layout issues is to learn to write standard code. You really don't need different stylesheet or hacks to build a website that works.
Andy G 6 years ago
ie9 should be standards compliant. *should* be (astrick pun not intended)
dougwig 6 years ago
For IE7 and below I like the "!ie" hack:

.smallText { font-family:Arial; font-family:Tahoma !ie }

I believe !anything will work but !ie is nice and explanatory
PBT 6 years ago
Yep, knowing what they do would just make too much sense, and save everyone a LOT of time... DUH.
Davinder Bhardwaj 4 years ago
hey, what is the IE9 CSS conditional hack