Discussion :

[zeflex]

Salut,

Je souhaiterai centrer verticalement une image par rapport à une div, mais je n'y arrives pas. La fonction v-align n'as pas l'air de fonctionner non plus.

L'image quand à elle est générée à la volée, donc on ne connait pas ses dimensions à l'avance, d'ou la difficulté à centrer verticalement celle ci.

Voici un extrait du code, qui aurait une petite idée ? Merci.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
	<div style="float: right; width: 140px; border: 1px solid #000000; padding: 2px; text-align: center; ">
		<div style="background-color: #FFFFFF; width: 136px; height: 136px; margin-bottom: 10px; text-align: center; border: 1px solid #000;">
		<img src="miniature.php?filename=images/good.jpg&max=130" style="border: 0px solid #000;">
		</div>
		<div style="background-color: #FFFFFF; width: 136px; height: 136px; margin-bottom: 10px; text-align: center; border: 1px solid #000;">
		<img src="miniature.php?filename=images/good.jpg&max=130" style="border: 0px solid #000;">
		</div>
		<div style="background-color: #FFFFFF; width: 136px; height: 136px; margin-bottom: 10px; text-align: center; border: 1px solid #000;">
		<img src="miniature.php?filename=images/good.jpg&max=130" style="border: 0px solid #000;">
		</div>
	</div>

[Floriang33]

Essaye margin:auto;.

[zeflex]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<img src="miniature.php?filename=images/good.jpg&max=130" style="margin: auto;">

?

Ne fonctionnes pas

[Floriang33]

C'est normal.
Tu ne peux pas faire un margin:auto; sur un objet sans dimension .
Laisse le margin:auto; mais avec ta valeur width.

[zeflex]

Ben c'est à dire que mon image peut varier en height comme en width

Disons que dans le div blanc de 136x136, je veux centrer une image horizontalement et verticalement mais je ne connais pas les valeurs height et width de cette image...

D'ou le " miniature.php?filename=images/good.jpg&max=130 "

max = 130 représentant la valeur maxi en width ou height en fonction des dimensions de la photo (plus grande en hauteur ou largeur) - cette info est traité dans miniature.php -

Donc le centrage horizontal est ok par rapport au text-align: center; mais le vertical me pose soucis si la photo est plus large que haute ...