Why I don’t use HTML or CSS hacks

I’ve been teaching (X)HTML and CSS for over a decade now and I’ve never ever taught hacks. You know, those little bits of code that many designers use to make their pages look the same in multiple browsers. (Yes, IE is typically the problem in this situation.) Whenever asked I’ve explained that when you use a hack, at some time in the future the problem your "solving" with said hack is going to get fixed and then your hacked page is now broken. Don’t believe me? Check out this article from ars technica about the forthcoming IE8. Here’s just two bits:

Internet Explorer 8 is going to be the most standards-compliant IE yet, but it’s going about it in a way that has some people scratching their heads. With Internet Explorer 8, you have a choice in standards compliance modes. Sound oxymoronic? Shouldn’t there be one standards mode by default? Heck, shouldn’t the only mode be standards mode? Ah, idealism.

When IE8 eventually ships, it will have three rendering modes, two of which are the already familiar "quirks mode" and "(not so) standards mode." In an IE team blog entry, IE Platform Architect Chris Wilson revealed a third mode that can be invoked by developers: 

  1. "Quirks mode" remains the same, and compatible with current content.
  2. "Standards mode" remains the same as IE7, and compatible with current content.
  3. If you (the page developer) really want the best standards support IE8 can give, you can get it by inserting a simple <meta> element.

This third mode will use a <meta> tag to specify that a page should use the behavior of a specific browser version. To get IE8 really-standard-this-time-we-mean-it behavior, a page will include an element like <meta http-equiv="X-UA-Compatible" content="IE=8" />. That says that a page should use IE8’s behavior—and should use it even in IE9, IE10, or any future version. The first two modes will continue to use the doctype switch to choose between them. 

Clear as mud? I thought so. (Read the whole article and it’ll start to make sense, I promise.) Look, just don’t use markup or style hacks. If you feel you "must" in order to get your design to work, adjust your design so that you don’t have to use the hack. You’ll thank me in the long run.

January 25th, 2008 by