28220 sujets

CSS et mise en forme, CSS3

Centrage Tableau

J'ai cherché un peut partout sur le site et sur le forum mais je n'ai pas trouvé ce que je cherchais :s... J'aimerais pouvoir centrer un tableau simplement

la largeur du tableau est inconnue

J'ai essayé ceci


.center
{
text-align: center;
}

<table>
<tr>
<th>Titre</th>
<td>Cellule</td>
<tr>
</table>


Mais ceci a pour effet de centrer le contenu du tableau or moi j'aimerais centrer le tableau en entier :s
Si tu ne connais pas la largeur du tableau, y'a pas vraiement de solution !

Si tu connais la largeur par contre cela ne pose pas de problème.
Arf C'est vriament naze sa c'est pas possible qu'on puisse pas centrer un simple tableau

On arrive a faire des truc de malade et un truc tout bidon comme le centrage on y arrive pas :o
Peut-être en écrivant le CSS suivant :
table { margin-left: auto; margin-right: auto; }

J'ai souvent pu résoudre des problèmes de centrage par cette méthode... L'inconvénient, c'est Internet Explorer et ses sempiternels bugs de rendu CSS 2, dans certains cas il ignore ces instructions.
En espérant que ça peut t'aider !
Ca parait peur être C.. mais en mettant tout simplement la balise <center>avant la <table> de ton code (comme au bon vieux temps des tableaux...) Pourquoi ça ne marcherait pas??? Ca reste tjr du html non? et ton site en CSS ne va pas être gaché par une petite balise? non? Smiley smile
Modérateur
Tant qu'à utiliser une balise obsolète, aussi bien de faire ceci :


<div style="text-align:center;">
Ton tableau
</div>


Ensuite, suffit de rétablir l'alignement pour tes cellules avec du CSS :

td {
text-align:left;
}


Reste juste à adapter ca à ton goût, si tu veux créer une class pour ton div. Une idée comme ca.

Edit : oubliez ca, j'ai rien dis. Ce message vaut pas un clou. J'étais sous l'effet de l'alcool Smiley biggol
Modifié par Merkel (17 May 2005 - 19:40)
Modérateur
C'est que la balise CENTER est dépréciée, ce qui signifie qu'il y a un risque à l'utiliser, c'est-à-dire que dans certains navigateurs récents, le centrage risque de ne pas fonctionner.

Je retire quand même ma suggestion. J'avais cru un instant qu'on ne pouvait pas centrer le tableau si on ne connaissait pas sa largeur. J'ai testé par la suite et la méthode à fwed marche très bien, même dans IE. Donc, oublions les scotch et les sparadrap, et utilise les margins auto. Ca va être beaucoup plus propre.

Merkel - qui se disait aussi que pour centrer un tableau, il ne fallait pas un div supplémentaire... la fatigue peut-être ! Pourtant j'utilise déjà la méthode des marges pour centrer mes tableaux, mais j'ai répondu trop vite. Smiley confus
Modifié par Merkel (17 May 2005 - 19:46)
Salut

pour Moz. :
table{margin:0 auto}


et pour IE appliquer au conteneur:
body{text-align:center}
Oki merci et j'ai rétabli ensuite l''alignement dans mon tableau avec un text-align: left

Pour ceux que sa interresserais voici le code Smiley smile 



.center
{
text-align: center; /* Pour Centrer le tableau sous IE */
}

.tableau
{
margin: auto; /* Pour Centrer le tableau sous FF */
text-align: left; /* On rétablit l'alignement a gauche du texte dans le tableau */
}

<div class="center">
<table class="tableau">
<tr>
<th>Titre</th>
<td>Cellule</td>
</tr>
</table>
</div>

Modifié par fieldset (19 May 2005 - 16:18)
Sujet clos
Aller à