Centrer un tableau HTML

Sur une page que je suis en train de travailler en ce moment, je ne peux pas semblent être en mesure de centrer un tableau avec une image dans la première ligne et deux colonnes de texte ci-dessous (les deux colonnes ne devrait pas être supérieur à la largeur de l'image)
Voici la page : http://www.puzzles-et-jeux.com/fr/page/minipuzzles.html
J'ai passé beaucoup de temps à essayer de résoudre ce problème.
Je tiens à la garder en HTML car je rush et aussi parce que je dois créer 20 pages de la sorte avec différentes largeurs /+ mises en page pour chaque image.

InformationsquelleAutor FabricePMW | 2012-12-28
  1. 96

    Pour votre design, il est de pratique courante d'utiliser des divs plutôt qu'un tableau. De cette façon, votre mise en page sera plus facile à gérer et modifiables grâce à un bon style. Il ne prendra un certain temps pour s'y habituer, mais il vous aidera à une tonne dans le long terme, et vous apprendrez beaucoup de choses sur la façon dont le style œuvres. Cependant, je vais vous fournir une solution pour le problème à portée de main.

    Dans vos feuilles de style que vous avez les marges et padding mis à 0 pixels. Il remplace votre align="center" attribut. Je vous conseille de suivre ces paramètres de votre CSS que vous n'avez normalement pas à l'envie de tous vos éléments d'être affectés de cette manière. Si vous savez déjà ce qui se passe dans le CSS, et que vous voulez les garder, alors vous devez appliquer un style à votre table pour remplacer les précédents jeux. Vous pouvez soit donner à la table une class ou vous pouvez mettre le style inline avec le HTML. Voici les deux options:

    1. Avec une classe:

      <table class="centerTable"></table>

    Dans votre style.fichier css que vous auriez quelque chose comme ceci:

    .centerTable { margin: 0px auto; }

    1. En ligne avec votre code HTML:

      <table style="margin: 0px auto;"></table>

    Si vous décidez d'effacer les marges et padding mis à 0px, alors vous pouvez garder align="center" sur votre <td> balises pour quelle que soit la colonne que vous souhaitez aligner.

    • Note: je ne vais pas downvote vous, mais ... je ne suis pas à bord avec le fait de dire que la méthode que vous préférez, qui est "bon" et de la méthode de quelqu'un d'autre essaie de l'utiliser est donc inappropriée. C'est le CSS et le HTML: Ce qui fonctionne c'est bon. Certains léviter vers une méthode, d'autres léviter vers un autre. Mais si un navigateur basé sur l'affichage correct de l'information: Il a été fait droit. C'est ce qu'il est. Je ne vous donnent bravo (et le upvote) pour la fourniture de la solution et si l'on avait utilisé une expression plus proche de "comment je fais" plutôt que "bon", j'aurais même été heureux à ce sujet. 😉
    InformationsquelleAutor Wesley Porter
  2. 34
    table
{ 
margin-left: auto;
margin-right: auto;
}

    Ce sera certainement le travail.
    Cheers

    • merci, fonctionne parfaitement, et est HTML5 conformes à la différence des précédentes réponses.
    InformationsquelleAutor Talha Daniyal
  3. 11

    Essayer ce -

    <table align="center" style="margin: 0px auto;"></table>
    • align attribut est obsolète et inutile pour les pages d'exploitation en respectant les standards de mode (c'est à dire avec le bon DOCTYPE).
    InformationsquelleAutor Avinash T.
  4. -1
    <table align="center"></table>

    Cela fonctionne pour moi.

    InformationsquelleAutor alhelal