Min-height sur Internet Explorer

Actualité par (Intégrateur du Dimanche, Strasbourg)
Créé le , mis à jour le (82647 lectures)

Question souvent posée, celle de la propriété min-height non reconnue IE.

Voici quelques hacks diffusés sur le web :

Pourtant, il semblerait qu'une petite astuce puisse régler ce problème, en tout cas sur bon nombre de navigateurs.

Il suffit de commencer par donner une hauteur fixe au bloc (#bloc). Cette hauteur sera considée comme un min-height pour IE : elle s'allongera en fonction du contenu.
Par contre, les autres navigateurs vont respecter la hauteur de façon rigoureuse et le contenu dépassera du bloc.
Il suffit alors de rajouter une instruction non comprise par IE (html>body #bloc) et qui rétablira les choses pour ces navigateurs.

Cette astuce m'a été donnée par Antoine.

Si quelqu'un pouvait faire des tests sur différents navigateurs standards :

#bloc {
height: 5em;
background: yellow;
}
html>body #bloc {
height: auto;
min-height: 5em;
}