salut
en simplifant la situation j’ai ceci:
un div conteneur gris qui contient 3 div rouges, le conteneur ne prend pas plus de 2 div rouges en largeur
mes div rouges sont float:left clear:none
ce qui se schématise comme suit :
| div1 div2 |
| div3 |
| |
| |
ensuite je pas de le div rouge 2 en clear:left
sous firefox, j’obtient ceci, ce qui me parrait logique
| div1 |
| div2 div3 |
| |
| |
sous IE, j’ai ça :
| div1 div3 |
| div2 |
| |
| |
le div2 descend bien, mais le div3 remonte à la place du div2
je suppose que firefox interprete mieux le code que ie, non?
voilà le code
[cpp]
[/cpp]
donc la question est : comment peut on gérer le problème?
le positionnement sous ie ayant une logique moins évidente que celle de firefox
merci
@++
en gros les questions sont :
quel navigateur a bon? je vote pour FF!
comment bidouiller pour que ça marche comme il fait avec les 2 navigateurs?
j’ai un peu ton probleme aussi, deux div en largeur dans un conteneur : ss IE si on réduit la page le div de droite passe dessous, pas encore trouvé la parade
utilise des classe CSS !
clear:none te sert à rien
FF respecte les normes, IE invente les siennes
dansle cas présent, le contexte du problème est que j’ai écris des classes php pour les formulaires html et que je voudrais pouvoir placer les divers éléments les 1 par rapport aux autres
dc les classes css, c un peu chaud à implanter dans ce cas
et là je les utilise dans des porjet de stage et dans la boite il sont à 99% (on laisse 1% au bénéfice du doute) sous IE, c mal
sur cet exemple, ya aussi, les padding qui marche pas comme ilfaut, et le display inline, la vieille finte pour remédier aux marges doublées avec les float : float:left; margin:10px --> ie met une marge de 20 à gauche, c beau m$!
déjà eu le problème, apparament c’est un bug connu de IE donc… rien à y faire…
J’ai du recoder entièrement mon premier site XHTML valide en HTML valide à cause de se problème…
waip, dc en l’occurence, les float, je me les mets …
et je fais tout en posisition absolute … mwarf
finalement je peux travailler avec des float
mais faut que je comble les espaces vides avant les div clear par des div invisible … misère
dans leur ie7 ils vont réparer ce bug là ou pas ?
bon, finalement, j’ai trouvé une finte, et j’en fais profiter tous le monde :
il faut mettre un <br/> apres chaque div précédent un div clear left
et alors ça donne ça :
<div id='in'><input type="text" name="id" id="id1" value="1"><label for="id1">le texte</label></div><br/>
<div id='in' style='clear:left;'><input type="text" name="id" id="id2" value="2"><label for="id2">le texte</label></div>
<div id='in'><input type="text" name="id" id="id3" value="3"><label for="id3">le texte</label></div>
#in{ float:left;
margin-bottom:10px;
margin-left:10px;
border: blue 1px solid;
height:22px;
width:170px;
}
au passage, dans le div, mon label est float left et mon input float right, pour que celà reste aligné, il faut mettre le input(float right) en 1er dans le code
++