Vertical-align marche pas chez moi!

salut!

Voici tout de suite mon code:

<div style="border: 1px solid; height: 200px; width: 200px; vertical-align: middle; text-align: center; display: table-cell;">
	<img src="photos/Montreal/mini_44.jpg"></img>
</div>

Avec ce code j'obtiens un cadre de 200x200px avec une photo au centre. Jusque là tout va bien. Maintenant je rajoute float: left comme ceci:

<div style="border: 1px solid; height: 200px; width: 200px; vertical-align: middle; text-align: center; display: table-cell; float: left;">
	<img src="photos/Montreal/mini_44.jpg"></img>
</div>

et là ma photo n'est plus centrée elle se retrouve tout en haut du cadre.
J'ai besoin de ce float: left; pour le script php que je suis en train de créer. Est-ce qu'il y a moyen pour que mes photos restent centrées svp?
Modifié par vicodins (22 Mar 2005 - 05:26)

Je crois que float: left "convertit" le display en block En effet, on ne peut pas floater une case de tableau Utilise plutôt line-height. Donc ton cas, ce sera line-height: 200px, cela devrait fonctionner...

vicodins a écrit :
salut!

Voici tout de suite mon code:

...
<img src="photos/Montreal/mini_44.jpg"></img>
...

Au passage, cette syntaxe (formellement valide) est déconseillée car elle n'y a aucune garantie qu'elle soit supportée par tous les agents utilisateurs. Voir http://blog-and-blues.org/weblog/2005/01/09/371-fermeture-elements-vides-xhtml
Modifié par Laurent Denis (22 Mar 2005 - 08:09)

FlorentG a écrit :
Je crois que float: left "convertit" le display en block En effet, on ne peut pas floater une case de tableau Utilise plutôt line-height. Donc ton cas, ce sera line-height: 200px, cela devrait fonctionner...

Ca ne marche pas . Ca me fait la meme chose qu'avec vertical-align. Quand j'ai float: left; les images se placent en haut du cadre.

merci Laurent Denis pour l'info