Aide sur tableau

**PoppyGuy** · 04/12/2011, 15h46

Bonjour,
Comment centrer un tableau ?

J'ai bien vu comment faire un tableau dans le tutoriel.
Centrer un tableau avec :

Code css :

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

1
2
3
4
#tab, #tab caption
{
    margin: auto;
}

Mais ou je mets ça :

Code html :

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

1
2
3
4
5
6
style="border: 0pt none ; margin: 0pt; padding: 0pt; width: 900px;">
<tbody>
<tr>
<td style="text-align: left;"><!-- date --> <img
src="http://meteoclopiniere.olympe-network.com/Images/h0.gif"
name="date_img1" alt=""> <img

Merci de votre aide
Cordialement
Guy

**Jygle** · 04/12/2011, 16h11

je pense que tu peux ajouter dans ton fichier css une partie sur la balise <table> dans laquelle tu écrira :

Code :

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

1
2
3
4
5
 
table{
     position : absolute ;
     left : XX% ;
}

Avec XX% qui dépend de tes tests. C'est une solution un peu bancale, mais je l'ai déjà utilisée sur des éléments autres que des tableaux, et ça marche plutôt

**PoppyGuy** · 04/12/2011, 16h36

Bonjour,
Je n'arrive pas à le centrer

**Jygle** · 04/12/2011, 17h00

Tu n'arrive pas à trouver le bon pourcentage, ou bien cette méthode ne marche pas sur le tableau ?
Sinon, tu peux essayer ça, à la place

Code :

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

1
2
3
4
 
margin-left:auto;
margin-right:auto;
width:100%;

**PoppyGuy** · 04/12/2011, 17h10

Voilà ce que j'ai actuellement :

Code html :

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

1
2
3
<table
style="border: 0pt none ; margin: 0pt; padding: 0pt; width: 900px;">
<tbody>

Si il y a 100%, il est centré, mais je souhaite qu'il fasse que 900px

Si je mets :

Code :

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

margin: 50pt

, ça arrive à centrer,mais il met un grand espace au-dessus et en-dessous ?????
Il à tripler en hauteur ????

**NoSmoking** · 04/12/2011, 17h23

Bonjour,
il est temps de passer à la déclaration des styles hors balises

.
pour ton soucis

Code :

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

1
2
3
4
table{
  width : 900px;
  margin : auto;
}

et un petit exemple pour voir où il faut le mettre

Code html :

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
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Centrage d'un élément</title>
<style type="text/css">
table {
  width : 900px;
  margin : auto;
  border : 1px solid black;
  text-align : center;
}
</style>
</head>
<body>
<table><tr><td>TABLE centrée dans la page</td></tr></table>
</body>
</html>

en bonus dans la

http://css.developpez.com/faq/?page=...orizontalement

**Jygle** · 04/12/2011, 17h54

Ah oui, j'avais pas comprit que tu mettais ton style dans les balises^^. Sinon, je me suis aussi trompé dans le width, j'ai recopié la même chose que l'exemple que j'avais sous la main --> donc, il faut bien entendu remplacer le 100% par la taille que tu souhaite attribuer à ton tableau.
Par contre, une petite question de ma part : mettre margin-left : auto + margin-right : auto, est ce que ça fait la même chose qu'un simple margin : auto ?

**PoppyGuy** · 04/12/2011, 18h05

Décidément, ce n'est pas fait pour moi.
Ne pas arriver à entrer un tabeau, je deviens fou.
Je vais donc mettre 100%, tant pis, et il fera toute la page.
Mettre celui de la date"right" et celui des heures "letf".

**NoSmoking** · 04/12/2011, 18h08

oui et non, c'est la forme simplifiée de margin:auto auto auto auto;.

à lire sur la

Comment simplifier mon Style CSS (raccourcis) ?

**PoppyGuy** · 04/12/2011, 18h13

Les 900px, c'est la longueur que je souhaite.
Mais ça ne le centre pas, il est toujours coller à gauche.

**NoSmoking** · 04/12/2011, 18h48

Envoyé par PoppyGuy

Les 900px, c'est la longueur que je souhaite.
Mais ça ne le centre pas, il est toujours coller à gauche.

il faut ajouter le style comme indiqué plus haut dans l'exemple ET supprimer celui qui est dans la balise TABLE qui, lui, est prioritaire.

**PoppyGuy** · 04/12/2011, 19h03

Ok d'accord pour le centrage.
Le problème, c'est que j'ai 3 tableaux, j'ai voulu faire une bordure aux 2 tableaux de gauche et de droite et là c'est pareil, ça ne prend que l'ensemble des 3 tableaux.

Merci de ton aide

**NoSmoking** · 04/12/2011, 19h18

Envoyé par PoppyGuy

Ok d'accord pour le centrage.
Le problème, c'est que j'ai 3 tableaux, j'ai voulu faire une bordure aux 2 tableaux de gauche et de droite et là c'est pareil, ça ne prend que l'ensemble des 3 tableaux.

Merci de ton aide

il te faut passer par les sélecteurs...

je remets l'exemple plus haut en utlisant le principe

Code html :

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
22
23
24
25
26
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Centrage d'un élément</title>
<style type="text/css">
#table_1 {
  width : 900px;
  margin : auto;
  border : 1px solid black;
  text-align : center;
}
#table_2 {
  width : 100px;
  margin : auto;
  border : 1px solid red;
  text-align : center;
}
 
</style>
</head>
<body>
<table id="table_1"><tr><td>TABLE centrée dans la page</td></tr></table>
<table id="table_2"><tr><td>2éme TABLE centrée dans la page</td></tr></table>
</body>
</html>

Il serait peut être temps de lire la

http://css.developpez.com/faq/?page=...html#css_class,
ou même les tutoriels et notament http://css.developpez.com/tutoriels/premiers-pas/
cela ne devrait pas être une perte de temps

**PoppyGuy** · 04/12/2011, 19h36

Ok d'accord.
Merci de ton aide.
Pour apprendre, il faut que je démarre avec quelque chose de nouveau, sinon je suis perdu.
Ce que je souhaitais, c'est finir ma page d'accueil et après je m'exercerais au langage

Merci pour tout
Cordialement

**NoSmoking** · 04/12/2011, 19h48

Pour apprendre, il faut que je démarre avec quelque chose de nouveau, sinon je suis perdu.
Ce que je souhaitais, c'est finir ma page d'accueil et après je m'exercerais au langage

Permets moi de ne pas être d'accord, ta page accueil et de conception simple et sa remise en forme ne devrait pas te poser gros problèmes attendu qu'il ne faut jamais oublier qu'il existe encore des feuilles et des crayons au cas où l'on veuille mieux visualiser ce que l'on souhaite faire.

Mais c'est toi qui décides

**PoppyGuy** · 04/12/2011, 20h28

Ok

Aide sur tableau

Tableau en CSS

Discussions similaires

Partager

Partager