div hauteurs identiques

[olala]

bonjour,

j'aimerais savoir comment vous faites pour avoir plusieurs div en float: left avec une hauteur identique.

chaque div a une structure interne differente : pas le meme nombre de lignes, des images differentes ....

chaque div a une couleur de fond avec une bordure.

en ajoutant la balise "height: 223px" , ca marche tres bien. mais :

si l'utilisateur change la taille des caracteres dans son naviguateur >affichage >taille du texte >la plus grande

- sous IE, super, les div s'agrandissent automatiquement et font tous la meme taille, genial !

- sous firefox, les tailles des div restent figées et tout les contenus sortent a l'exterieur

j'espere que ma question est claire

comment 2 div alignés horizontalement avec un contenu different peuvent avoir la meme hauteur sachant que l'utilisateur peut varier la taille des caracteres dans son naviguateur ?

merci

[mamijo]

bonjour, c'est clair et un peu plus d'informations nous serait utile car le comportement des CSS dépend énormément du contexte

L'idéal serait d'avoir le code HTML (avec le doctype) et le code CSS...

edit : orthographe (peu est singulier )

Modifié 18 Mai 2006 par mamijo

[jeanpierre949]

il n'y a aucun moyen de resoudre mecaniquement le probleme avec les css, seul un effet visuel est possible, en placant en arriere plan un bloc avec la couleur ou l'image de background du div pour simuler ce div

.

exemple

[petit-ourson]

<div style="_height:223px;min-height:223px;float:left">
conteneur 1
</div>

<div style="_height:223px;min-height:223px;float:left">
conteneur 2
</div>

<div style="_height:223px;min-height:223px;float:left">
conteneur 3
</div>

C'est de la bidouille mais bon ... où sinon passer par une feuille de style dédié à Internet Explorer avec l'attribut height dedans.

[jeanpierre949]

ton code ne permet pas d'afficher des colonnes d'hauteurs identiques.

il attribue seulement un min-height mais si le contenu varie tu ne controles plus rien.

" div d'hauteurs identiques" titre du post.

[petit-ourson]

oui effectivement ça résolvera juste son problème de texte qui déborder de sa div.

Sinon je ne pense pas que cela soit possible de le faire sans tableau car j'ai une fois cherché assez longtemps pour le faire.

Si quelqu'un a une solution en CSS, je suis prenneur ;o)

Edit : J'ai bien évidemment pas parlé du javascript qui pourrait résoudre le problème.

Modifié 18 Mai 2006 par petit-ourson

[jeanpierre949]

je viens de la donner dans mon premier post

[petit-ourson]

je viens de la donner dans mon premier post

<{POST_SNAPBACK}>

Ah oui au temps pour moi, j'avais pas vu ce message.

Par contre ce n'est plus possible dès que l'on a une taille fluide et non fixe.

Or, je vends des écrans (entre autre) 20, 21, 24 pouces et j'aimerai que mes clients puissent jouir de la puissance de leurs matériels ;o)

Donc euh s'il existe une solution fluide ;o)

[olala]

je vous remercie pour vos reponses.

je cherche effectivement a faire ca en fluide.

je suis en train de tester une methode que j'ai trouve ici

[petit-ourson]

Merci olala.

[olala]

bon ben j'ai trouvé

il suffit de déclarer les blocs div en "em" et ca marche tres bien sous IE et Firefox.

par exemple

.container { height: 32em; font: normal 0.7em/1.4em }

si on change la taille des caracteres dans le naviguateur, tout suit et les longueurs des div sont identiques

[Raphael]

je suis en train de tester une methode que j'ai trouve ici

Hello,

Faire des "cellules" en CSS (c'est à dire des éléments de même hauteur) a toujours été une plaie, à cause de certains navigateurs déficients.

La solution est en effet très simple : utiliser la règle "display: table-cell"... sauf que IE ne reconnait pas encore cette règle

Il existe quand-même plusieurs façons de faire des "cellules" de même hauteur :

http://forum.alsacreations.com/faq/#item17

[petit-ourson]

Oui une plaie.

Me souvient que j'avais bien galéré et pas trouvé de solution car l'autre contrainte c'est que certains éléments devaient être aligné vers le bas aussi.

enfin je crosi que olala a trouvé son bonheur ;o)