[Résolu] Problème de clear : left ...

Bonjour !
Je poste sur ce forum car j'ai un porblème de positionnement qui apparait uniquement sous mozzilla ! (pour une fois que ce n'est pas ie)...

J'ai un conteneur avec d'un coté une sidebar et de l'autre un contenu (shéma de site standard)

la sidebar est en float left

Dans mon contenu j'ai des miniatures qui sont une liste avec les éléments en float: left.

En dessous de cette liste j'aimerais mettre un formulaire d'ajout.
Je lui ai mis la propriété clear:left pour éviter qu'il aille à la suite de mes miniatures, mais il s'aligne bizarrement sous la sidebar ...

Je n'arrive pas à trouver pourquoi...

voila un shéma de ma page (si ce n'est pas très clair):


et un lien vers le bug en question (bug visible que sous FF)
http://www.iseplive.fr/bug.htm

Merci d'avance pour vos réponses
Modifié par Swal (03 Aug 2006 - 19:09)

Bonjour,

C'est un comportement tout à fait normal, et qui se produit dans tous les navigateurs conformes: le clear appliqué au formulaire réagit à tous les flottants présents à l'affichage, et donc aussi au menu.

Pour l'éviter, le conteneur de "contenu" doit être un contexte de formattage, c'est à dire avoir l'une des propriétés float, overflow autre que visible, etc.

Tu ne rencontres pas le problème dans IE, en raison d'un bug de celui-ci qui produit le même effet qu'un contexte de formattage (par exemple, si ton contenu est dimensionné).

Voir http://test.blog-and-blues.org/clear-and-block-formatting-contexts/
Modifié par Laurent Denis (03 Aug 2006 - 18:20)

Ah, pardon pour le lien: celui-ci sera plus agréable à lire, je crois :
http://www.blog-and-blues.org/articles/Float%2C_clear_et_contextes_de_formatage

Merci aussi
Je me posais justement ce problème ^^

Merci beaucoup pour ce lien intéressant!

Mais dans mon cas quelle est la meilleure propriété à ajouter à mon div de contenu ? le visible simple me convenait très bien ! J'ai peur d'avoir d'autres problèmes si je change...

un overflow:auto serait il le plus adapté ? si je ne spécifie aucune largeur/hauteur cela ne changera rien non?




J'ai rajouté un overflow:auto sur mon conteneur central, mais j'ai une grosse marge qui est apparue à gauche !
sous IE c'est toujours bon
[/edit]
Modifié par Swal (03 Aug 2006 - 18:42)

Au plus simple:

#content {
overflow: hidden;
zoom: 1;
}

cela crée une marge à gauche, bizarre !

Le zoom: 1; est déja dans un style à part pour IE car non valide...

Oui, il faut supprimer la marge du contenu. Voir ce message (c'est la journée des sujets qui se croisent, décidément )

Ca y est tout est résolu, et en plus j'ai compris !
Merci Laurent !

Laurent Denis a écrit :
Ah, pardon pour le lien: celui-ci sera plus agréable à lire, je crois :
http://www.blog-and-blues.org/articles/Float%2C_clear_et_contextes_de_formatage

Excelent lien !! Je me posais justement cette question il n'y a pas si longtemps...