texto-alinear en una tabla en una celda (<table> dentro de <td>)

Aquí hay algo que nunca pensé que diría: Tengo un problema en Firefox y Chrome, pero funciona bien en IE.texto-alinear en una tabla en una celda (<table> dentro de <td>)

Es muy simple, pero no entiendo por qué no trabajar:

tengo una tabla dentro de una célula, y tengo style="text-align:right" en la célula, pero la mesa está quedando a la izquierda en Firefox y Chrome (en IE está yendo obedientemente a la derecha ...). Si pongo align = right en la etiqueta de celda entonces funciona, pero no quiero hacer eso.

Código es básicamente:

<table width="1000" border="1" cellpadding="0" cellspacing="0"> 
<tr> 
<td style="text-align:right"> 

<table border="1"> 
<tr><td>Hello</td><td>Hello 2</td></tr> 
</table> 

</td> 

<td>Hello 2</td></tr> 
</table>

no quiero la tabla anidada para ser width = 100% o algo por el estilo ...

Podría alguien por favor me explique por qué doesn' t trabajo, y cómo solucionarlo, y ¿por qué funciona en IE pero no en Firefox o Chrome?

Fuente

2011-11-10 user1039769

Creo que es correcto en FF y Chrome. La tabla no es texto, por lo que text-align no debería afectarlo. Align debería funcionar en cualquier contenido. – Randy

Gracias, entonces, ¿cómo usaría css para alinear la tabla en la celda? ¿Es esto nuevo?Volví a la creación de sitios web después de un par de años, y nunca tuve este problema antes? – user1039769

La alineación de texto afecta a los elementos en línea y en bloque, no solo al texto. – maxedison

Supongo que Chrome y FF son los que lo renderizan correctamente. text-align probablemente no se supone que afecte a los elementos table. Sin embargo, aplicando float:right a la tabla hará lo que quiera.

Fuente

2011-11-10 13:00:40 maxedison

¡Muchas gracias a todos! Exactamente lo que quería. – user1039769

Me gustaría agregar que la forma de CSS para alinear las tablas relativas a su contenedor es con la propiedad de margen.

Debe agregar margin: 0 auto; si desea alinearlo al centro, o margin-left: auto; si desea alinearlo a la derecha.

Como dice @maxedison, text-align funcionará solo con elementos inline y inline-block, por lo que la otra solución es cambiar su tabla interna para tomar algunos de esos valores de visualización.

También debe recordar que text-align funciona desde 'contenedor-a-contenido', esto significa que normalmente se aplica a un contenedor para afectar su contenido (aplicado a p para afectar su contenido en línea como el texto) y margin: 0 auto funciona desde 'contenido a contenedor', lo que significa que normalmente se aplica a un elemento de bloque y afecta su posición relacionada con su contenedor (aplicado a un div para centrarlo en su elemento principal).

Fuente

2012-11-01 22:46:30

Manipulación * 'margin' * propiedad funcionó perfectamente, gracias! – informatik01

Si desea solucionarlo (no con la funcionalidad completa), se puede escribir la siguiente:

table { 
    display: inline-block; 
}

Esto hace que la mesa pueda ser centrado con text-align: center;, si se aplica al elemento (s) de los padres.

Fuente

2013-12-25 07:00:24 think123

cuando no se desea que el div a ser flotante, es posible que intente esto: http://jsfiddle.net/NvEZ8/

<div style="text-align:right;"> 
    <table style="display:inline-block"> 
     <tbody> 
     <tr> 
      <td></td> 
      <td>one</td> 
      <td>two</td> 
     </tr> 
     </tbody> 
    </table> 
</div>

Parece text-align (con un DOCTYPE html) sólo afecta inline-block en Chrome y no solo en línea elemento. Sustituir el bloque en línea por inline aquí y ya no funciona en mi Chrome

Fuente

2014-02-13 13:56:49 Chboing

texto-alinear en una tabla en una celda (<table> dentro de <td>)

Respuesta

Cuestiones relacionadas