[CSS] centrer un tableau

**Azharis** · 08/01/2006, 14h55

Voila, j'éssai de centrer un tableau au milieu de la page avec du code CSS mais je n'y arrive pas.

J'ai réussi à la centrer avec ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
table
{
	caption-side : top;
	position : absolute;
	left : centrer;
}

Le problème c'est que vu qu'il y a quatre tableaux, ils se chevauchent tous.

Avez-vous la solution ?

Merci.

**ilood** · 08/01/2006, 15h19

La prorpriét left: centrer me parait erronée.
Pour centrer un tableau j'aurai fait :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

table { margin : 0 auto }

**Azharis** · 08/01/2006, 15h30

En effet, le left : center ne marche pas.

Mais le auto ne marche pas non plus, le tableau reste sur le côté gauche.

**ilood** · 08/01/2006, 15h37

Le margin auto ne fonctionne sous IE que si tu as déclaré un doctype au début du document.

**Nesmontou** · 08/01/2006, 15h37

Salut, en fait le margin: 0 auto; marche très bien sous FireFox mais pas sous IE ; pour remédier à cela, il faut mettre text-align: center; pour l'élément qui contient le tableau

Voici un petit exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html>
<head>
	<style type="text/css">
	body {text-align: center;} /* Pour centrer dans IE */
	table {background-color: #f00; margin: 0 auto;} /* Pour centrer dans FF */
	</style>
</head>
<body>
<table>
	<tr>
		<td>test</td>
		<td>test</td>
		<td>test</td>
	</tr>
	<tr>
		<td>test</td>
		<td>test</td>
		<td>test</td>
	</tr>
</table>
</body>

Bon développement ;-)

**djnos** · 08/01/2006, 17h07

Salut, alors moi perso j'aurais pas mis la position en absolute pour centrer le tableau. Si tu fais ça il pourra pas centrer et mettra par défaut le tableau collée au bloc parent à 0px en partant du haut et 0px en partant de la gauche.

fais plutôt

table
{
margin-left:auto;
margin-right:auto;
}

exemple (il faut mettre le doctype) :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
table
{
margin-left:auto;
margin-right:auto;
border: 1px solid blue;
}

</style>
</head>
<body>
<table>
<tr><td>Hello</td><td>World</td></tr>
</table>

</body>
</html>

**Azharis** · 08/01/2006, 18h19

C'est bon, j'ai fait un div avec une classe qui a la propriété text-align : center, et ca marche très bien comme ca.

Merci de votre aide.

[CSS] centrer un tableau

Centrer un élément en CSS

Discussions similaires

Partager

Partager