Tableau HTML centré

Tableau
Html

jlebohec -
ed - 16 juin 2011 à 15:29

Bonjour,

J'ai à peu près le même problème, voici mon code :

<table align="center" border="1" >
<tbody>
<tr>
<th>Préconisations</th>
<th>Evènements</th>
</tr>
<tr>
<td>
<div class="separator" style="clear: both; text-align: left;"><a href="http://julienlebohec.files.wordpress.com/2011/06/special-t.ppsx"><img class="alignleft size-full wp-image-43" title="PPT préconisations" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo1.png" alt="" width="136" height="136" /></a></div></td>
<td><a href="http://julienlebohec.files.wordpress.com/2011/06/c3a9vc3a8nement-final-special-t.ppsx"><img class="alignright size-full wp-image-44" title="PPT évènement" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo2.png" alt="" width="131" height="131" /></a></td>
</tr>
</tbody>
</table>

Je souhaite pour ma part, tout centrer : tableaux, texte et images

Quelqu'un pourrait-il m'aider ?

Merci d'avance

Afficher la suite

A voir également:

Centrer tableau html
Tableau word - Guide
Trier tableau excel - Guide
Editeur html - Télécharger - HTML
Imprimer un tableau excel - Guide
Tableau croisé dynamique - Guide

7 réponses

Résumé de la discussion

Des utilisateurs cherchent à centrer un tableau HTML ainsi que son texte et ses images dans une page, notamment sous WordPress, en utilisant des options d'alignement et des styles CSS. Plusieurs réponses proposent d'entourer le tableau d'une cellule centrée ou d'utiliser des attributs align et des div avec text-align:center, tandis que d'autres insistent sur l'édition directe du code HTML plutôt que l'éditeur visuel. En pratique, le fil montre des exemples concrets incluant des tableaux à deux colonnes et deux lignes, des images centrées dans les cellules et des conseils sur l'utilisation des styles pour obtenir un centrage homogène.

Réponse 1 / 7
ed

Voili Voilou :

<html>
<head>
<title>
Centrer table
</title>
</head>
<body>
<div style="width:100%; text-align:center;">
<TABLE>
<TBODY>
<TR>
<TD>
<INPUT value="Bouton Center" type=button>
</TD>
</TR>
</TBODY>
</TABLE>
</div>
</body>
</html>
0
Réponse 2 / 7
jlebohec

Merci, mais cela ne fonctionne pas.

Je vous poste le lien de la page que je souhaite modifier, le tableau étant tout à la fin.

Voici le lien : http://julienlebohec.wordpress.com/travaux-scolaires/etudes-marketing-special-t/
0
1. ed
  
  Ton tableau est dans une div ?
  
  0
2. jlebohec
  
  Non c'est le contraire, ma div est dans mon tableau
  
  0
Réponse 3 / 7
ed

Oki sinon tu peux faire comme ca mais c'est pas très pro on va dire :

<CENTER>
<TABLE>
<TBODY>
<TR>
<TD>
<INPUT value="Bouton Center" type=button>
</TD>
</TR>
</TBODY>
</TABLE>
</CENTER>
0
Réponse 4 / 7
ed

Ou encore mieux :

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<table>
<td>
<INPUT value="Bouton Center" type=button>
</td>
</table>
</td>
</tr>
</table>
0
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Réponse 5 / 7
jlebohec

Le rendu est encore pire avec cette méthode
0
Réponse 6 / 7
jlebohec

Je reformule mon souhait :

Je veux faire un tableau avec deux colonnes et deux lignes centré.
Dans mes deux premières cellules je veux mettre du texte, centré.
Et dans la dernière ligne, je veux mettre deux images, centrées elles aussi.

Voici mon code : (les images renvoient à un lien)

TABLE align="center" BORDER="1">
<TR>
<TH> Préconisations </TH>
<TH> Evènements </TH>
</TR>
<TR>
<TD> <div class="separator" style="clear:both;text-align:center;"><a href="http://julienlebohec.files.wordpress.com/2011/06/special-t.ppsx"><img class="aligncenter size-full wp-image-43" title="PPT préconisations" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo1.png" alt="" height="136" width="136"></a><br></div>
</TD>
<TD> <div class="separator" style="clear:both;text-align:center;"><a href="http://julienlebohec.files.wordpress.com/2011/06/c3a9vc3a8nement-final-special-t.ppsx"><img class="aligncenter size-full wp-image-44" title="PPT évènement" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo2.png" alt="" height="131" width="131"></a>
</TD>
</TR>
</TABLE>
0
1. ed
  
  Tu n'as pas fermé ta deuxième div dans le <TD> !!
  
  0
2. jlebohec
  
  Je viens de la fermer, le problème persiste ..
  
  0
3. ed
  
  Sinon il fonctionne ton code !!! Ou alors j'ai toujours pas compris ce que tu voulais faire !!
  
  0
4. jlebohec
  
  Sa fonctionne, certes, mais ni le tableau, ni le texte, ni les images ne sont centrées
  
  0
5. ed
  
  Si ils sont centré dans le tableau !!
  
  0
Réponse 7 / 7
lm88fr

<style type="text/css">
table {
text-align: center;
}
table tr th, table tr td {
vertical-align: center;
}

a img {
border : none;
}
</style>

<table border="1" align="center">
<tbody>
<tr>
<th>Préconisations</th>
<th>Evènements</th>
</tr>
<tr>
<td>
<a href="http://julienlebohec.files.wordpress.com/2011/06/special-t.ppsx"><img class="alignleft size-full wp-image-43" title="PPT préconisations" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo1.png" alt="" width="136" height="136" /></a>
</td>
<td>
<a href="http://julienlebohec.files.wordpress.com/2011/06/c3a9vc3a8nement-final-special-t.ppsx"><img class="alignright size-full wp-image-44" title="PPT évènement" src="http://julienlebohec.files.wordpress.com/2011/06/pptlogo2.png" alt="" width="131" height="131" /></a>
</td>
</tr>
</tbody>
</table>
0
1. jlebohec
  
  Je ne sais pas utiliser le code CSS,, il apparaît en visuel quand je le rentre dans la partie HTML
  
  0
2. ed
  
  les balises <style></style> tu les mets entre les balises <head></head>
  Apres il n'y a rien de compliquer...
  
  0

Tableau HTML centré

7 réponses

Discussions similaires

Newsletters