I've really, really tried hard to not ever rant about this. But I can withstand it no longer. Internet Explorer should die. It should be banned from the face of this earth. I mean it when I say it's the worst browser ever to forced down on consumers.

I've seen so many sites that show those "best viewed" logos. I've been considering making my own recently: Best viewed with anything but Internet Explorer. Here follows a short list of things that bug me (and yes, it may be that my html skills aren't as good as I thought):

• png support. Particularly it's transparency: http://tlug.up.ac.za/old/ie.html.
• ActiveX. Thank goodness people is using this tech less and less. It simply doesn't work on anything else and closes down your website to a rather large viewer base.
• CSS support. It sucks. To put it nicely.
• It completely ignores the alt attribute for img tags. Take for example the following broken image link: . If you are using Internet Explorer you will see one of those boxes with a red X in it instead of the text "broken image example".
• It's padding is useless. I can't use padding-left: 10%; in my stylesheet cause this causes Internet Explorer to misrender the page to such an extent that it is totally unusable. Instead I had to pick a fixed number of pixels and use that. Had enough yet?
• It's padding is inclusive on the width tag. I use <div> tags in order to display text on top of an image. And at this point I slightly break the spec since I'm not actually allowed to put <div> tags inside of <a> tags. <span> tags however doesn't do the job. I don't have an example of this publicly available yet, as soon as I do, I'll post it. Basically, if the background-image is 158px wide, and I want to use 133 of that for placing text, then for other browsers (those I tested) I need to use width: 133px; in the stylesheet. However, for Internet Explorer I need width: 158px;. Also, as far as I understand it's perfectly legal to spec font-size: 13px; to specify the height of a font. For some reason Internet Explorer just doesn't do the right thing here. I've got top and bottom padding of 3px respectively and yet the total height of the div ends up being approx 22px (causing the image to tile - which can be switched off). Basically this ends up looking like this:
  

  In the stylesheet:
  .div_link {
      background-image: url(images/blank-menu.gif);
      vertical-align: middle;
      font-variant: small-caps;
      font-weight: bold;
      padding-left: 25px;
      padding-top: 3px;
      padding-bottom: 3px;
      width: 133px;
      height: 13px;
      font-size: 11px;
      margin: auto;
      margin-bottom: 7px;
  }
  
  In the html:
  <a href="foo.php"><div class="div_link">Foo</div></a>

  
  For Internet Explorer one basically needs to adjust the height and width style elements, as well as the font-size. If I'm wrong in this and the Internet Explorer interpretation is correct and Firefox and Opera is wrong on this, please let me know.
• Either my html on http://www.northerns.co.za/ is seriously broken or Internet Explorer miscalculates cell widths. The copyright notice wasn't there because the client requested it. It was placed there to make the cell wide enough so that Internet Explorer would render the page correctly. The new version has an even wider body and on higher-resolution screens the copyright notice is not long enough. Go figure. I've now added a hidden line of text beneath the notice that spans about two lines of text on a 1152x864 screen.

And that is just complaining about broken features, never mind it's lack of features. Things like:

• Popup blockers.
• Cookie manager.
• Tabbed browsing.
• Lack of plug-in abilities (or does it have?).
• Decent download manager.
• ...

Granted, these are not show-stoppers and I can live without them, but they are damn handy.

You can find a couple of sample screenshots of my experiences whilst building the above site here.