322 votes

Comment centrer le contenu d'un tableau HTML ?

J'utilise un fichier HTML <table> et je veux aligner le texte de <td> au centre dans chaque cellule.

Comment centrer le texte horizontalement et verticalement ?

471voto

David Laberge Points 2224

Voici un exemple avec CSS et inline style attributs :

td 
{
    height: 50px; 
    width: 50px;
}

#cssTable td 
{
    text-align: center; 
    vertical-align: middle;
}

<table border="1">
    <tr>
        <td style="text-align: center; vertical-align: middle;">Text</td>
        <td style="text-align: center; vertical-align: middle;">Text</td>
    </tr>
</table>

<table border="1" id="cssTable">
    <tr>
        <td>Text</td>
        <td>Text</td>
    </tr>
</table>

http://jsfiddle.net/j2h3xo9k/

EDITAR : Le site valign est déprécié en HTML5 et ne doit pas être utilisé.

1 votes

N'est-ce pas le vertical-align:middle censé être appliqué à la tr élément ?

2 votes

Si vous mettez un img dans le même td n'a pas fonctionné

76voto

Carsten Points 7024

Le CSS pour centrer le texte dans votre td Les éléments sont

td {
  text-align: center;
  vertical-align: middle;
}

49voto

Hayden Thring Points 525

Exemple de style HTML en ligne :

<td style='text-align:center; vertical-align:middle'></td> 

Exemple de fichier CSS :

td {
    text-align: center;
    vertical-align: middle;
}

38voto

Boris Points 259

Essayez de mettre ceci dans votre fichier CSS.

td {
    text-align: center;
    vertical-align: middle;
}

-3voto

Balaswamy Vaddeman Points 2737

<td align="center"valign="center">textgoeshere</td>

plus sur valign

15 votes

L'attribut valign n'est pas pris en charge par HTML5. Utilisez le CSS à la place.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X