Manière CSS d’aligner horizontalement la table

Je veux afficher un tableau de largeur fixe au centre de la fenêtre du navigateur. Maintenant j’utilise

Mais Visual Studio 2008 met en garde sur cette ligne:

L’atsortingbut ‘align’ est considéré comme obsolète. Une construction plus récente est recommandée.

Quel style CSS dois-je appliquer à la table pour obtenir la même mise en page?

Steven a raison, en théorie :

la manière «correcte» de centrer un tableau à l’aide de CSS. Les navigateurs conformes doivent centrer les tables si les marges gauche et droite sont égales. La manière la plus simple d’y parvenir est de définir les marges gauche et droite sur «auto». Ainsi, on pourrait écrire dans une feuille de style:

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

Mais l’article mentionné au début de cette réponse vous donne tout le contraire pour centrer un tableau.

Une solution css élégante à travers les navigateurs: Cela fonctionne à la fois dans MSIE 6 (Quirks et Standards), Mozilla, Opera et même Netscape 4.x sans définir de largeur explicite:

 div.centered { text-align: center; } div.centered table { margin: 0 auto; text-align: left; } 

Essaye ça:

 

Simple. IE6 et ci-dessus seront heureux de centrer votre table avec “marge: 0 auto;” si seulement la page est rendue en mode “standards”. Pour ce faire, vous avez besoin d’une déclaration de type doctype valide, telle que

 < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

ou

 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

Il est vrai que IE5.5 et les versions ultérieures refuseront toujours de centrer la table, mais peut-être que vous pourrez vivre avec cela, surtout si la page est toujours fonctionnelle avec la table alignée. Je pense qu’à présent, les utilisateurs d’IE5.5 et versions ultérieures sont assez habitués à certains sites Web étranges, mais vous devez toujours vous assurer que ces problèmes ne rendent pas votre site inutilisable.

Heureux codage!

EDIT: Désolé, je devrais peut-être faire remarquer que vous n’avez pas besoin d’un doctype “ssortingct” pour obtenir IE6 et en mode de rendu “standard”. Je me suis rendu compte que cela pouvait paraître comme cela dans les exemples de doctype que j’ai publiés ci-dessus. Par exemple, cette déclaration de doctype fonctionnera bien sûr également:

 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

Bien que cela puisse être une hérésie dans le monde d’aujourd’hui – dans le passé, vous feriez le code non-css suivant. Cela fonctionne dans tous les navigateurs jusqu’à aujourd’hui, mais, comme je l’ai déjà dit, c’est une hérésie dans le monde d’aujourd’hui:

 
...

Ce dont vous avez besoin est un moyen de dire que vous voulez centrer une table et que la personne utilise un navigateur plus ancien. Ensuite, insérez les commandes “

” autour de la table. Sinon – utilisez css.

Étonnamment – si vous voulez tout centrer dans la zone BODY – vous pouvez simplement utiliser la norme

 text-align: center; 

commande css et dans IE8 (au moins) il centrera tout sur la page, y compris les tableaux.

 style="text-align:center;" 

(je pense)

ou vous pourriez simplement l’ignorer, cela fonctionne toujours

Cela devrait fonctionner:

 

J’apprends juste cela et ce qui a finalement fonctionné pour moi a été de créer d’abord une table avec trois rangées. Définissez la marge pour les lignes gauche et droite à 50%. Ensuite, placez une table à une seule ligne et à largeur fixe à l’intérieur des “données de table” de la “ligne de tableau” centrale.

  
Item1 Item2