CSS : min-height : comment émuler le min-height pour IE

Merci pour cette astuce qui sera très utile pour les navigateurs ayant du mal avec le CSS :) .

Excusez moi messieurs mais il me semble que sous IE la propriété height agit comme min-height... ca servait à rien d'hexiber ta p'tite ligne de js soit-disant salvatrice :D...

Et pour ce qui est de IE, personnellement c'est le browser qui me pose le moins de problèmes avec les css...

sauf que si tu mets un height, alors les autres navigateurs que IE (c'est à dire ceux qui implémentent les standards correctement) forcent la hauteur à la valeur de height que tu as donnée, même si le contenu est normalement plus haut. Du coup ça bouzille tout.

personellement, je développe avec Firefox. Ensuite, je vérifie avec :

- Safari : presque aucun problème, au pire je mets 1/2 heures à corriger les bavures
- Opera : idem
- IE : alors là, ça se gatte, il y a très souvents de gros gros problèmes d'affichage que je peux mettre parfois 1/2 journée à corriger de façon satisfaisante.

Est-ce que tu peux m'expliquer pourquoi des pages qui s'affichent bien avec Firefox, Safari et Opera ne s'affichent mal que dans IE ?

Parce que tous les navigateurs modernes implémentent correctement les standards du web tels que définis par le W3C, et pas IE.

<<Et pour ce qui est de IE, personnellement c'est le browser qui me pose le moins de problèmes avec les css...>>
De nos jours la mauvaise foi paie bien.

"Et pour ce qui est de IE, personnellement c'est le browser qui me pose le moins de problèmes avec les css."

Qu'est ce qu'on peut en lire des sotises...

J'ai trouvé mieux :

.container {
width:20em;
padding:0.5em;
border:1px solid #000;
min-height:8em;
height:auto;
}
/* for Internet Explorer */
/*\*/
* html .container {
height: 8em;
}

source : http://www.cssplay.co.uk/boxes/minheight.html

Personnellement vu le nombre d'incompatibilités entre IE et firefox, j'ai laissé tombé le CSS unique et je fais un css pour ie et un autre pour firefox que je load avec :
if (eregi("MSIE", getenv("HTTP_USER_AGENT")))
{$style_sheet = "ie.css";}
else {$style_sheet = "firefox.css";}

Bon courage

Florent, c'est pas si simple.

Le problème est que généralement, les problèmes d'implémentation des CSS sur IE sont liés à des BUGS et mauvaises interprétations d'IE 6.

Alors qu'est-ce qui va se passer quand IE 7 sortira ? (il est déjà disponible en libre téléchargement en beta).

Ton site "optimisé" pour IE (6) va être tout bouzillé sur IE7 ?

Fonctionne numéro un ce code.
J'avais un problème de min-height pour un pied de page qui s'étire automatiquement pour un portail qui contient du php.(longeur de texte dépend de chaque utilisateur inscrit sur le portail.)
Dans tous les cas merci pour ce code ca sauve des vies:P

chow

Légende : firefox respecte beaucoup mieux les standard w3C. Chaque navigateur a ses propres incohérences.
Ne fermez pas la balise title dans firefox le site apparaît dans la page.
Dans IE le site est dans la barre de titre normal non !!! (un exemple que j'ai eu avec un stagiaire...).
D'autres exemples : le padding agrandit le div au lieu d'appliquer les marges intérieures. obligé de gérer l'overflow pour le background d'une div. etc...
Donc si vous voulez encore vous la raconter c'est sans moi.

95% des gens utilise IE il faut donc s'assurer que les sites sont d'abord compatible IE en pure div. en plus maintenant IE 6 et IE7.

Le mieux est l'ennemie du bien...

la lutte antitrust microsoft même si elle est justifiée est une perte de temps et l'instance W3C n'est pas plus démocratique que les autres.

J'en ai marre des fondamentalistes et des standards du web établies par des gens qui ne tiennent pas compte des outils actuels.

Une fois que les standards sont à peu près reconnus et stabilisés, ils remettent tout en question et ajoute à la confusion.
Microsoft comme les autres.

Il faut bien entretenir le marché , car au bout du compte nous ne sommes que des consommateurs à plumer dans un système économique marchand.

MERCI a toi et à djedie :

les javascripts peuvent être désactivés mais le CSS ne l'est pas !

Donc ce code est plus efficace encore :

.container {
width:20em;
padding:0.5em;
border:1px solid #000;
min-height:8em;
height:auto;
}

/* for Internet Explorer */
/*\*/
* html .container {
height: 8em;
}

Dans certains cas sous IE la hauteur d'un block ne s'adapte pas au contenu si ce dernier depasse la hauteur defini dans height, surtout en l'associant avec float et overflow !
j'ai donc opté la solution pure IE : expression
c'est proche du code js mentionné dans ce forum, sauf que celui la s'inserre dans la feuille de style :

* html #body {height:expression(this.clientHeight<400?400:this.clientHeight)}