Chrome : interprétation de overflow: hidden; bizarre [Résolu]

Bonjour,

J'ai développé un site basé sur le gabarit 08 de Alsacréations (http://www.alsacreations.com/static/gabarits/modele08.html).

J'ai été amené à modifier la feuille de style de ce gabarit pour ajouter les deux lignes ci-dessous en gras :

/* Contenu secondaire */
#secondaire {
background: #181A12; /* -> 2 */
overflow: hidden;
height: 1%;
}

J'ai fait cette modif car dans la colonne de droite (#secondaire), j'ai inséré en haut un bloc avec un float left et le seul moyen que j'ai trouvé pour pouvoir ajouter des blocs en-dessous facilement a été d'utiliser le overflow: hidden (j'ai essayé <hr style="clear:both" mais ça avait pour conséquence de placer les blos du dessous en bas du gabarit).

Au final, ma modif fonctionne bien sous IE, FF mais sous Chrome la colonne de droite (#secondaire) disparait totalement!

Est-ce que vous avez une idée sur ce comportement bizarre de Chrome ?
Modifié par kaboume (10 Jun 2009 - 17:30)

Bonjour,

kaboume a écrit :
dans la colonne de droite (#secondaire), j'ai inséré en haut un bloc avec un float left et le seul moyen que j'ai trouvé pour pouvoir ajouter des blocs en-dessous facilement a été d'utiliser le overflow: hidden

Je ne comprends pas. Si c'est pour placer des blocs les uns en dessous des autres, quel est l'intérêt d'utiliser les flottants ?

Ou alors j'ai mal compris, tu as un bloc dans #secondaire qui contient un flottant et tu cherches à créer un contexte de formatage ? Dans ce cas le overflow:hidden est une solution parmi d'autres, sauf que cette propriété doit-être appliquée au bloc qui contient le flottant, et non au conteneur parent.

Et ce height:1%, à quoi il sert ? Le problème ne viendrait-il pas de là par hasard ?
Modifié par BeliG (10 Jun 2009 - 16:51)

En fait le premier bloc de la colonne de droite est un calendrier généré par YUI avec le style float:left.

Tu as raison, il n'y a aucun intérêt d'avoir des float si je mets les bloc les uns en dessous des autres.

J'ai finalement modifié le style du calendrier en retirant le float:left et ça fonctionne.

En tout cas merci bcp d'avoir pris le temps de me répondre.

Je t'en prie.

Sujet [Résolu] ?

Oui.
En effet.

Mon précédent message te suggérait d'éditer le titre de ton sujet pour y placer l'annotation [Résolu].