One of the biggest frustrations for website designers is that Internet Explorer’s engine can absolutely trash the look of a website. I tried something new in my latest website – pulling in a separate stylesheet for IE. It makes sense, why clutter good code with hacks that might not work tomorrow?
The code below does the trick:
<!--[if IE 6]>
<link href="~/Styles/Styles-IE.css" rel="stylesheet" type="text/css" />
<![endif]-->
Also, my example that I posted for a simplified UI had all of its hidden options shown in Internet Explorer despite the fact that there was a “display: none” parameter inside the div tag. The problem? Internet Explorer applies visible padding to hidden elements! I fixed this by adding the following to the div tag in my IE only stylesheet:
display: inline-block;
Give it a shot, as it seems to resolve some really weird rendering errors!
Check out my tumblog, fool! I linked you.
LikeLike
I think I use to do this before i started hacking. Except then I use javascript.
LikeLike
I had opted for the javascript route on my site for a long time. I didn’t want what I consider IE specific, as in only IE can interpret them, hacks in my markup. However, after some some debate, I decided to go with this method to disable stylesheets in IE
LikeLike