Legacy Internet Explorer Bugs Cheatsheet (Archive)

A reference guide to historically notorious rendering bugs and JavaScript quirks encountered when maintaining legacy Internet Explorer (IE8) sites.

Known IE8 Quirks & Workarounds

1. change Events on Radio & Checkbox Controls

In IE8, the change event on <input type="checkbox"> and <input type="radio"> does not fire immediately when clicked; it only fires after the input loses focus (defocus).

• Workaround: Listen to the click event instead of change for instantaneous state updates on radio and checkbox inputs.

2. Clickable <label> Elements Wrapping Inputs

In IE8, clicking a <label> containing an input field fails to toggle or focus the inner input control.

• Workaround: Ensure every input has a unique id="...", and explicitly pair it with <label for="...">.

3. Opacity Inheritance on Positioned Descendants

Setting filter: alpha(opacity=50); on a parent element fails to cascade down to descendant elements that possess position: relative or position: absolute.

• Workaround: Explicitly apply the opacity filter rule directly to positioned descendant children.

4. hasLayout Trigger Quirks (IE6 / IE7)

Many layout glitches (disappearing content, box-model collapses) in IE6/7 occurred when an element lacked internal layout dimensions.

• Fix: Trigger hasLayout using zoom: 1; in CSS.

References

• Positioniseverything: Explorer Exposed