IE7 CSS Scrolling Div Bug

Question

Je suis récemment tombé sur un bug d'IE7 que je pensais partager alors quand je viendrai sur ce site dans 6 mois pour trouver la même chose, je l'aurai en main.

je crois que la meilleure façon de recréer ce bug serait le code HTML suivant dans une page avec une doctype déclarée (cela fonctionne correctement en mode "Quirks"/non-doctype):

<div style="overflow: auto; height: 150px;"> 
    <div style="position: relative;">[...]</div> 
</div> 

Dans IE7, le div externe est de taille fixe et le div interne est relativement positionné et contient plus de contenu (en supposant que le div interne provoque un débordement). Dans tous les autres navigateurs, cela semble fonctionner comme prévu.

Screenshot:

Answer 1

Le moyen le plus fixe serait d'ajouter position: relative; à la div extérieure. Cela fera fonctionner IE7 comme prévu.

(Voir: http://rowanw.com/bugs/overflow_relative.htm).

EDIT:Cache version of the broken link on waybackmachine.org