Sujets similaires

Bonjour à tous,

Voila, j'ai sur le portail de mon forum 3 tableaux. Grace à la propriété display j'ai pu les mettre tous les 3 côte à côte (chose que je voulais).
Maintenant, j'ai un léger souci, j'aimerai les aligner sans avoir recours à l'obsolète balise "center".
De plus, j'aimerai que ma balise "caption" (qui contient une image) soit également centrée par rapport au contenu du tableau.
Voici un extrait du code HTML d'un des tableaux (le plus petit) :

Code:: <table class="tabclasse">
<caption><img src="http://img11.hostingpics.net/pics/495017categoriemage2.png" /></caption>
<tr>
<td><img src="http://img11.hostingpics.net/pics/59085225eliterouge.jpg"/></td>
<td>darkfloflo</td>
<td>Niv 96</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/31659223elitevert.jpg"/></td>
<td>Baby-Angel</td>
<td>Niv 94</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/31659223elitevert.jpg"/></td>
<td>sakusau069</td>
<td>Niv 93</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/79983022nosrouge.png"/></td>
<td>$Jonathan$</td>
<td>Niv 93</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/30103124elitebleu.jpg"/></td>
<td>unfanduSDA</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/31659223elitevert.jpg"/></td>
<td>Miraginaire</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/31659223elitevert.jpg"/></td>
<td>Jérôme@62</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/79983022nosrouge.png"/></td>
<td>Saetine</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/97924621nosbleu.png"/></td>
<td>Serenis</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/97924621nosbleu.png"/></td>
<td>DarkVannes</td>
<td>Niv 92</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/79983022nosrouge.png"/></td>
<td>cerivin</td>
<td>Niv 91</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/79983022nosrouge.png"/></td>
<td>Shigomi</td>
<td>Niv 91</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/79983022nosrouge.png"/></td>
<td>Taoro</td>
<td>Niv 91</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/97924621nosbleu.png"/></td>
<td>lafoudre42</td>
<td>Niv 90</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/97924621nosbleu.png"/></td>
<td>TiteMiss</td>
<td>Niv 90</td>
</tr>
<tr>
<td><img src="http://img11.hostingpics.net/pics/97924621nosbleu.png"/></td>
<td>\\Gin//</td>
<td>Niv 89</td>
</tr>
</table>

Ainsi que le CSS:

Code:: .tabclasse {
line-height: 2;
color: #750E0E;
font-family: Georgia;
font-size: 1.2em;
display: inline-block;
width: 355px;
margin-bottom: 20px;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
vertical-align: top;
text-align: center;
}

Bonsoir,

Pour l'image, il suffit de rajouter ceci à ta balise :

Code:: style="align:center;"

Pour les tableaux, le mieux serait de tout englober d'une div et de faire pareil que pour l'image. Smile

Cela n'a aucuns effets ...

Bonjour,

Quel est exactement l'intérêt de placer trois tableaux côte à côte, plutôt que de faire un tableau plus grand et avec plus de colonnes ? O_o

Pour l'alignement, là encore je ne comprends pas, s'ils sont trois côte à côte, on ne peut pas les centrer... à moins que tu ne souhaites centrer le trio par rapport au conteneur, auquel cas la solution de Melone est presque juste, à ceci près que pour centrer un bloc, on n'utilise pas la même propriété que pour centrer un texte. Je te laisse lire le tutoriel d'Espeon sur le centrage de blocs.

Le fait d'avoir choisi de faire 3 tableaux est simplement pour s'y retrouver étant donné qu'il faut régulièrement les modifier ...

Sinon, je crois qu'un screen s'impose Razz

Sur ce screen on peut voir que le contenu des tableaux n'est pas du tout centré par rapport aux images de début de tableau (qui sont contenues dans des balises "caption"). Je voudrais donc cnetrer le contenu du tableau par rapport au caption.

Dans ce cas, ce serait peut être plus avisé de modifier la largeur des cellules (genre 50% chacune) et d'aligner le contenu de la première à droite, et le contenu de la seconde à gauche. Ça aura un rendu "centré" comme ça.

Perdu dans mes tableaux ...

Perdu dans mes tableaux ...

Sujets similaires

Sujets similaires

Partenaires Or