28220 sujets

CSS et mise en forme, CSS3

Salut Smiley smile

Voila ma page test : Ici

Si on regarde sous IE le cadre tout jaune au centre dessent jusqu"au div #bas alors que sous firefox non Smiley decu
Comment regler ce probleme ?

PS : ce n'est pas un design ! les couleurs sont là pour montrer le principe et rien de plus Smiley smile

Merci à vous !

PS2 : on m'a donné cette solution :

height:auto!important;
height:455px;


Que je dois appliquer au #bloc

Mais je ne la comprend pas très bien, et je voudrais savoir si il existe d'autres solutions
Modifié par Snoopy17 (07 Jan 2006 - 17:00)
Bonjour,

La hauteur du bloc jaune dépend de son contenu en flux. Selon CSS2, le menu flottant ne doit pas être pris en compte dans ce calcul. C'est pourquoi l'arrière-plan jaune ne n'étend pas dans FF ni dans les autres navigateurs conformes.

En revanche, IE Win implémente incorrectement CSS2, et tient compte des flottants dans le calcul de hauteur d'un conteneur quand celui-ci a une hauteur ou une largeur spécifiées, fictive ou réelle. La valeur de cette hauteur ou de cette largeur n'a aucune importance : ce qui compte est que les propriétés height et width donnent au conteneur un état particulier dans IE, appelé le layout, qui provoque à son tour ce bug de rendu. Voir http://test.blog-and-blues.org/haslayout/tests/float1.html

Pour supprimer ce comportement dans IE Win, il faut supprimer la propriété width du conteneur jaune, et/ou toute autre propriété conférant cet état de layout (voir http://test.blog-and-blues.org/haslayout/ )

Pour reproduire au contraire le même comportement dans les navigateurs conformes, il faut donner au conteneur une propriété overflow avec n'importe quelle autre valeur que visible (Voir FAQ du forum)

Le hack qui t'a été donné n'aura aucun effet utile. Il ne fait qu'ajouter une valeur de heigh:455px lue uniquement par IE, qui dégrade son rendu, et une valeur de height:auto lue par les navigateurs conformes qui ne change rien pour eux. Sur le fonctionnement de ce hack, voir http://blog-and-blues.org/weblog/2004/09/03/295-le-meilleur-hack-possible-pour-ie#c453 . En sachant que rien ne garantit que ce hack, comme d'autres, ne posera pas de problèmes avec IE7. Mieux vaut utiliser les commentaires conditionnels pour corriger une CSS pour IE (voir FAQ du forum)
Modifié par Laurent Denis (06 Jan 2006 - 13:14)
Bonjour,

J'ai essayé un overflow:auto; sur #bloc et cela marche tres bien sur firefox.
Mais maintenant cela ne marche pas sur internet explorer. Je suis obligé de donner un widht pour que cela marche :'(

Merci de votre aide Smiley smile

PS : L'url est la même que dans le premier post Smiley cligne
Dans la faq, il est dit :
a écrit :
Il faut noter qu'Internet Explorer nécessite parfois qu'une dimension (largeur ou hauteur) du conteneur, même inutile, soit précisée explicitement, pour appliquer cet overfow:auto.

Donc tu dois en effet appliquer un width.
Modifié par Hermann (07 Jan 2006 - 16:50)
Ah merci je n'avais pas vu ca Smiley decu
Encore desolé.

J'ai appliqué un width et tout marche nickel.

Je mes Réglé Smiley cligne