CSS : align right et display:block

[Remi]

Bonjour,

Je cherche une solution pour aligner une image à droite avec une construction du genre

#conteneur{text-align:right;}
#conteneur img{display:block;text-align:right;}

Le text-align marche sous IE mais pas sous FF (puisque l'image est un bloc).

Je ne peux pas passer l'image en inline parce que cela génère des lignes vides sous l'image.

Je ne peux pas la passer en float car j'ai besoin qu'elle soit dans le flux (c'est elle qui donne la hauteur, à gauche de l'image j'ai un contenu de hauteur variable qui est en float:left).

Les margin (qui sont classiquement utilisées pour résoudre ce problème quand on veut centrer) ne semblent être d'aucune aide ici.

Auriez-vous une idée ?

Modifié 19 Novembre 2007 par Remi

[ghost]

Bonjour,

Au pire float right avec un overflow: auto sur ton conteneur non?

#conteneur{overflow: auto;}
#conteneur img{display:block;float: right;}

Modifié 19 Novembre 2007 par ghost

[Remi]

Merci bien.

Le problème de l'overflow:auto est que je n'ai plus rien dans le flux donc le background du conteneur ne s'affiche plus sous IE6 (ah oui, parce j'ai un background en plus )

[ghost]

Re,

Désolé, j'ai été un peu court, pour FF, IE7 opera ... on applique un contexte de formatage grâce a overflow: auto(hidden) ce qui permet au contenu de suivre un contenant en float, un peu comme un clear donc ton background doit suivre.

Pour ie6, il faut pour appliquer ce contexte de formatage dimensionné le conteneur (une dimension suffit) donc soit width: 100%, si ton contexte le permet soit un height: 1% (de toute manière le height évolura... un vieux bug d'ie6) à utiliser avec un commentaire conditionnel. A noter aussi zoom:1; mais qui n'est pas valide!!

Voilou

[Remi]

Effectivement cela marche parfaitement en mettant le contenant à width 100%. Merci bien.

Le seul truc que j'ai du mal à voir c'est s'il s'agit d'une propriété normale d'Overflow:auto ou si c'est une propriété un peu détournée. Pour moi, Overflow c'était une propriété uniquement pour gérer les ascenseurs internes (donc que je n'utilisais jamais...).

[ghost]

Re,

Non ce n'est pas une propriété détournée...

Un peu de lecture : http://www.blog-and-blues.org/articles/Flo...es_de_formatage

Pour ie6, c'est un bug connu et là c'est plus un problème de Haslayout (Une petite chose assez confuse propre à IE)