Aide sur tableau [Résolu]

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

Citation:

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

Citation:

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

Citation:

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

04/12/2011, 16h36	#3
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	Aide tableau Bonjour, Je n'arrive pas à le centrer
	00

04/12/2011, 18h05	#8
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	Aide tableau 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".
	00

04/12/2011, 18h13	#10
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	aide tableau Les 900px, c'est la longueur que je souhaite. Mais ça ne le centre pas, il est toujours coller à gauche.
	00

04/12/2011, 19h03	#12
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	Aie tableau 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
	00

04/12/2011, 19h36	#14
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	Aide tableau 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
	00

04/12/2011, 17h54	#7
Jygle Candidat au titre de Membre du Club Étudiant Inscription : décembre 2011 Messages : 12 Détails du profil Informations personnelles : Sexe : Localisation : France, Marne (Champagne Ardenne) Informations professionnelles : Activité : Étudiant Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : décembre 2011 Messages : 12 Points : 13 Points : 13	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 ?
	00

04/12/2011, 18h08	#9
NoSmoking Modérateur Inscription : janvier 2011 Messages : 2 944 Détails du profil Informations personnelles : Sexe : Localisation : France, Isère (Rhône Alpes) Informations forums : Inscription : janvier 2011 Messages : 2 944 Points : 4 776 Points : 4 776	oui et non, c'est la forme simplifiée de margin:auto auto auto auto;. à lire sur la Comment simplifier mon Style CSS (raccourcis) ?
	00

04/12/2011, 20h28	#16
PoppyGuy Invité régulier Guy Retraité Inscription : novembre 2011 Messages : 36 Détails du profil Informations personnelles : Nom : Guy Localisation : France, Vendée (Pays de la Loire) Informations professionnelles : Activité : Retraité Secteur : Bâtiment Informations forums : Inscription : novembre 2011 Messages : 36 Points : 5 Points : 5	Aide tableaux Ok
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email