Firefox et min-height … WTF Mozilla ?

Sur un projet en cours, j’ai rencontré pas mal de problèmes avec la propriété CSS min-height avec Firefox, pas moyen d’avoir mes <section> ou <div> avec un hauteur minimum alors que firefox est sensé supporter cette propriété :/

Pour avoir beaucoup chercher, je note la solution ici et si en plus ça peut en dépanner d’autres… ;)

il faut déjà tester avec :

html,body{
    height:100%;
}

Si ça ne résout pas le problème, il faut fixer une propriété height sur l’élément recevant le min-height :

.content{
    height:1px;
    min-height:100px;
}

Je ne comprend pas la logique là dedans oO. Ça passe partout sans déclarer une hauteur sauf pour firefox ! Comme le projet est assez « dynamique » point de vue -contenu du DOM-, j’ai préféré ajouter une petite couche de JS pour doubler le bourzin, min-height en % donnant des résultats assez étonnant d’un navigateur à un autre.

J’ai eu encore un autre problème avec une fonction JS/jQuery (offset()) qui merdouillait quand le body avait la propriété CSS overflow:hidden. Ce qui me fait penser, peut-être à tord, que firefox deviens un peu l’IE6 de la « casse-couille attitude ».