Centrage [résolu]

Bonjour,

je cherche a centrer deux éléments l'un par rapport à l'autre, sur la gauche de l'écran.
Il s'agit d'une petite image et de sa légende.
Comme il s'agit de pages dynamiques, je ne connais pas à l'avance la largeur exacte de l'image ni la longueur du texte de la légende.

Avec un tableau ça fonctionne :

<table style="text-align:center">
<tr><td>
<a href=""><img src="toto"></a>
<p class="texte">Legende</p>
</td></tr>
</table>

Seulement impossible de le faire fonctionner sans passer par un tableau.

L'idée est de créer un conteneur (un div ?) de le positionner via les css qqpart dans l'écran et de mettre ces 2 éléments centrés dans le conteneur.

Une idée SVP ?

Merci beaucoup.
Modifié par FredericF (19 Jan 2006 - 17:32)

Bonjour FredericF et bienvenue sur ce forum.

Est-ce que tu pourrais baliser ton code avec le BBCode [ code][/code ] (sans les espaces) comme spécifié dans les règles du forum* ?

Ça le rendra plus lisible.



Merci.

* que tu as lues et approuvées en t'inscrivant.

Je suis pas une experte mais peut-être que cela te donnera des idées...

<div class="photo">
<img src="toto">
<br />
<span>Légende</span>
</div>

et css

.photo {
text-align: center;
position: relative;
top: 50px;
left: 100px
}

Modifié par Taly (19 Jan 2006 - 16:37)

La solution proposée par Taly devrait fonctionner, mais je ne vois pas l'intérêt du <span> pour insérer la légende ... on peut très bien s'en passer !

Ah ben j'ai finalement trouvé :

le html :

<div class="photo">
<a href=""><img src="toto"></a>
<p class="texte">Legende</p>
</div>

le css :

div.photo {
text-align: center;
position: relative;
float: left;
}

Merci
Modifié par FredericF (19 Jan 2006 - 16:57)