html - texto - como centrar una tabla en php

Centrar en el centro una tabla HTML

Question

En una página en la que estoy trabajando en este momento, parece que no puedo centrar una tabla con una imagen en la primera fila y dos columnas de texto debajo (las dos columnas no deben ser más que la imagen ancho) Aquí está la página: http://www.puzzles-et-jeux.com/fr/page/minipuzzles.html Pasé mucho tiempo tratando de resolver esto. Me gustaría mantenerlo en HTML porque tengo que apresurarme y también porque tengo que crear 20 páginas del tipo con diferentes anchuras / diseños para cada imagen.

Answer 1

Para su diseño, es una práctica común utilizar divs en lugar de una tabla. De esta manera, su diseño será más fácil de mantener y modificable mediante un estilo adecuado. Toma un tiempo acostumbrarse, pero te ayudará mucho a la larga y aprenderás mucho sobre cómo funciona el estilo. Sin embargo, le proporcionaré una solución al problema en cuestión.

En sus hojas de estilo tiene márgenes y relleno establecidos en 0 píxeles. Esto anula tu atributo align="center" . Recomiendo eliminar estas configuraciones de su CSS, ya que normalmente no quiere que todos sus elementos se vean afectados de esta manera. Si ya sabe lo que está pasando en el CSS, y desea mantenerlo así, entonces tiene que aplicar un estilo a su tabla para anular los conjuntos anteriores. Puedes darle una class la mesa o puedes poner el estilo en línea con el HTML. Estas son las dos opciones:

1. Con una clase:

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

En su archivo style.css, tendría algo como esto:

.centerTable { margin: 0px auto; }

2. En línea con su HTML:

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

Si decide eliminar los márgenes y el margen que se establece en 0px, puede mantener align="center" en sus etiquetas <td> para cualquier columna que desee alinear.

Answer 2

Prueba esto -

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

Answer 3

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

Esto funciona para mí

Answer 4

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

Esto definitivamente funcionará. Aclamaciones