More Internet Explorer Bugs

[Update: initially I thought this problem was limited to IE7 and earlier, I was wrong and it also happens in Internet Explorer 8. Kind of destroys what ever expectations I’ve had remaining for IE8]

Although Internet Explorer 8 was already released1 most users are going to stick to previous versions – I know this for a fact as even though Internet Explorer 7 is already more than a couple of years on the market it still only has slightly better then 50% of the Internet Explorer market (not including other browsers).

That being said, its always “fun” finding more Internet Explorer bugs, something which the web developer I’m working with is proficient in (which she isn’t really doing on purpose – I’m not sure if it counts in her favor or not 🙂 ), so here is the latest one she stumbled upon2:

Apparently, with Internet Explorer 8 and earlier –  if a container has an image floated in it and some other element which is set to have a negative margin-top (to make the element appear higher in the rendering then it originally was), then if the container has a background – and only if the container that holds both floated image and margin-skewed element has a non-transparent background – then the image is clipped to the start of the element with the negative margin – if you have IE, see here for the test case otherwise, here is a screenshot showing the problem:


All elements have a floated image and the third line has a negative margin (also floated to the right so it is easy to read – this has no effect on the bug). The first box has no background (transparent background) and does not exhibit the bug; The second box shows what happens when a background is applied – the image is clipped; The last box shows how to work around this bug: if the container (the red box) is forced to have a layout – in this case by giving it a CSS “zoom” property – then the bug does not exhibit itself.

The main problem with this bug (or atleast the problem we had with it) is that if the element with the negative margin is above the image, the image entirely disappears. In our case this was only exhibiting itself in the “mouseover” action which gave the element a background (while normally it was transparent) so when you moused over an element in IE the image would disappear and reappear when you moused out – and it was a bitch to triage :-/ .

Although this problem appears in all Internet Explorer versions, including 8, I still hope is that when Windows 7 will come along (with IE8 as default), it will be so good that people will upgrade in droves and all prior versions of Internet Explorer will become extinct – as a lot of other bugs that are IE7 only will go the way of the Dodo. Unfortunately, in addition to this being in conflict with my wish for global Linux domination ( 😉 ), this doesn’t seem likely to happen.

  1. and it boasts a superior rendering engine – which is almost on par with  Firefox 3: it breaks horribly in the WordPress edit post dialog – its the first serious rendering problem I’ve seen with IE8 []
  2. I haven’t documented the several previous ones we encountered – I might do so in the future []

6 Responses to “More Internet Explorer Bugs”

  1. Geoff Pinkus:

    …even though Internet Explorer 7 is already more then a couple of years on the market…


    My pet peeve.

  2. Ava Green:

    Internet Explorer 8 is very good because it is as stable as Opera. I hate the previous versions of IE like IE6 because it hangs frequently. `

  3. Oded:

    I didn’t have such a bad experience with IE crashing – it crashes a lot less then Firefox or Chrome (seriously – don’t talk to me about Opera: its horrendous, complicated and annoying, who cares if its stable).

    But anyway – the problem with IE was never stability, its that it is hell on earth to develop for it, a lot due to lack of good developer tools but mostly because all of its weird bugs and non-standard behaviors.

  4. Claudette Drewski:

    Will i just say thats relief to access a person that actually knows what theyre sharing using the web. You definitely can bring a concern to light and produce it important. More and more people really need to you might need and have this side of this story. I cant believe youre less popular when you definitely include the gift.

  5. Karl Blond:

    Keep up the excellent work , I read few articles on this website and I believe that your web site is real interesting and contains bands of excellent information.

Leave a Reply