[XHTML] Centrer une table horiz. et vert.: comment?

Bonjour,

Je ne trouve pas de solution efficace pour centrer une page horizontalement (balise center) et verticalement.

J'ai lu que je pouvais utiliser une propriété vertical-align: middle mais ça ne semble pas fonctionner ou je ne l'utilise pas correctement.

Sachant que tout mon contenu se retrouve dans une table, comment puis-je centrer le tout en tout temps?

Merci d'avance!

pour centrer verticalement utilise :

Code:

---

style="margin-top:hauteur"

---

hauteur est la valeur que tu vas mettre

Si j'ai compris tu souhaites centré un tableau qui contient ta page ... tu peux utiliser ça

Code:

---

1 2 3 4

<table align="center" valign="center"> ... </table>

---

ou sinon tu mets ton tableau dans un autre tableau qui contient qu'une case...

genre :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

<table ... style="width:100%; text-align: center;"> <tr> <td valign="center"> <table ... > <tr> .............; </tr> </table> </td> </tr> </table>

---

Citation:

---

Envoyé par 1tsiMat

Si j'ai compris tu souhaites centré un tableau qui contient ta page ... tu peux utiliser ça

Code:

---

1 2 3 4

<table align="center" valign="center"> ... </table>

---

---

Ca risque de ne pas trop marcher surtout ton valign qui n'a pas de "center" parmi ces attributs mais plutot "middle" et ca m'étonnerai que ca marche pas rapport au body :roll: non fixé

J'me disais bien qui avait un truc qui clochait merci de m'avoir repris!!!

Non en fait, Je veux centrer la table horiz. et verti. dans la page.

Je pensais peut-être faire une immense table width et height à 100% (donc compatible toute les résolutions) et de centrer la table imbriquée et utilise un valign middle.

j'ai un probleme qui me semble similaire. quand je met align="center" (dans un div) pas de probleme, son contenu est centré horizontalement, mais si je met valign="middle" ca ne change rien du tout, ca ne me le centre pas verticalement

Normalement ceci devrait fonctionner :

xhtml :

Code:

---

1 2 3 4 5

<table class="centrer"> <tr> ... etc etc ... </table>

---

css :

Code:

---

1 2 3 4 5 6

.centrer { width: 800px; height: 200px; margin: auto; }

---

Evidemment faut remplacer avec les 2 valeurs (largeur, hauteur) que tu souhaites ;)

Edit: J'en profite pour te déconseiller l'utilisation de tableau pour tout ce qui est mise en page... Essaie de n'utiliser un tableau que pour afficher des données :)

Salut

J'ai une technique intéressante à te proposer mais cela uniquement si la taille de ta table est fixe. Si ta table à l'id "global" et une taille de 780px x 460px par exemple et que tu mets le css suivant :

Code:

---

1 2 3 4 5 6 7 8 9 10 11

#global { position:absolute; left: 50%; top: 50%; width: 780px; height: 460px; margin-top: -230px; margin-left: -390px; border: 1px solid #000000; }

---

Le principe est simple : tu décale ta box de 50% pour que le coin haut gauche de ta box soit au milieu de la page puis tu centres le milieu de ta box en mettant des marges négatives (la moitié de la largeur/hauteur) ^^
@++