Probleme clear: both avec FF et pas IE ! [Résolu]

Bonjour,

Je rencontre un problème avec <hr style="clear: both">, je m'explique :

J'ai une page avec une liste de plusieurs articles qui se suivent et entre chaque article, je place un HR avec clear: both pour permettre le décalage de la <div> suivante vers le bas.

Mon problème est qu'après le premier <div> contenant mon premier article, un espace vertical important s'affiche sous Firefox et non sur IE, puis pour les <div> suivants, tout est correct !!!

J'avoue ne pas bien comprendre !
Si qq peut me donner une piste pour trouver une solution, merci d'avance.

Ci-après le lien où vous pouvez constater cette anomalie : http://www.parti-agathois.com/?p=pcons
Modifié par capfever (09 Jun 2006 - 08:28)

capfever a écrit :

J'ai une page avec une liste de plusieurs articles qui se suivent et entre chaque article, je place un HR avec clear: both pour permettre le décalage de la <div> suivante vers le bas.
Mon problème est qu'après le premier <div> contenant mon premier article, un espace vertical important s'affiche sous Firefox et non sur IE, puis pour les <div> suivants

Hello,

c'est moi ou bien il n'y a pas de <div> pour chaque article...?
Tu un bloc #content pour l'ensemble de la liste, mais ensuite pas de conteneur pour chaque article.

Essaies de faire un bloc pour chaque, pour que le hr sépare des blocs complets.

Merci de ta réponse yyoupla,

en effet, pour trouver une solution à mon problème, j'avais provisoirement supprimer le <div> pour chaque article.
Là, je l'ai remis et j'ai toujours le même probleme.
Ce qui m'étonne beaucoup, c'est que cela s'affiche correctement avec IE ... en général, on constate des problemes d'affichage surtout avec IE, non ?

Re,

il semblerait que tu aies oublié d'affecter ta classe .right au bloc #content.

<div id="content" class="right">

le probleme vient du fait que tu as sur la gauche un menu qui doit erte en float:left; le clear: both repousse ton bloc apres le menu .
Solution: mettre position:absolute dans le menu

yyoupla et jp94, merci pour vos réponses !

Effectivement le problème vient de la partie en position: relative et float: left.

J'ai testé les 2 solutions :
Soit mettre la partie gauche en position: absolute
Soit mettre la partie droite avec un float: right

Merci beaucoup pour votre aide !

pas de problème capfever
du coup, ton problème est résolu ?