2009-06-25 9 views
1

Disons que j'ai une ligne avec trois colonnes - quelques boutons sur les côtés gauche et droit et la largeur moyenne du fluide.Disposition de trois colonnes avec plusieurs navigateurs

Si le contenu de la colonne centrale atteint la zone de la colonne du milieu, le dépassement doit être masqué.

Cette solution fonctionne bien sur Firefox mais la sortie d'Opera et IE6 est très différente.

<div style="width:/fluid/"> 
    <input type="image" src="img1.png" style="margin: 4px 0 0 5px; float: left;"/> 
    <input type="image" src="img2.png" style="margin: 4px 5px 0 0; float: right;"/> 
    <input type="image" src="img3.png" style="margin: 4px 5px 0 0; float: right;"/> 
    <input type="image" src="img4.png" style="margin: 4px 5px 0 0; float: right;"/> 
    <div style="margin: 0pt 68px 0pt 26px;"> 
     <p style="margin: 0; cursor: pointer; overflow: hidden;">abcdefghijklmnopqrstuvxy</p> 
    </div> 
</div> 

Sur Firefox tout cela apparaît sur une ligne comme prévu - un bouton à gauche, trois boutons à droite, et la partie visible du contenu dépend de la largeur du conteneur div.

Sur Opera - une partie du contenu qui ne rentre pas dans une rangée est continuée sur la ligne suivante.

Sur IE6 - les boutons sont sur la première rangée, et le contenu est affiché sur la ligne suivante avec pleine longueur.

+1

S'il vous plaît le code de poster échantillon. –

+1

Il était là juste pas bien formaté. Fixé. –

Répondre

Questions connexes