Menu
Carl Camera

IE Mouseover Problem

I ran across an anomaly with Internet Explorer the other day. I had hooked a mouseover event for a DIV and found that it wasn't being fired in IE as it should.

I narrowed down the HTML and isolated the problem. It occurs in the bottom margin and padding area only -- and only when no width is specified, or if width is defined as auto.

mouseover hot zone diagram

Example Web Pages

  1. Example 1 shows the problem. The border should turn red as soon as you mouse over the gray border. This is what I see happening in Firefox but not IE. If you refresh the browser and enter the DIV from below, it does not fire when it should. Specifying width:auto produces identical results.
  2. Example 2 shows that when I add a width to the DIV then I get proper behavior in IE. Mouseover is fired at any point over the DIV.

Quirky Even In Quirks Mode

This is appearing in IE6 Standards mode (as the Examples show) but this behavior is not restricted to Standards Mode as far as I can tell. Even in quirks mode the lower padding and border area do not fire the mouseover event.

Has anyone else seen this? Is this fixed in IE7?

Comments