La tabla HTML/CSS alinea correctamente el texto que no funciona en IE

Una vez más, Internet Explorer no me está resultando fácil. Tengo una mesa con dos celdas en la misma fila. Quiero mostrar un texto alineado a la izquierda (primera celda) y otro alineado a la derecha (segunda celda). Esto está funcionando plenamente en Chrome y Firefox, pero en IE todo el texto aparece alineado a la izquierda:La tabla HTML/CSS alinea correctamente el texto que no funciona en IE

<table width="660px"> 
<tr> 
    <td align="left" width="160px">Text 1</td> 
    <td align="right" width="160px">Text 2</td> 
</tr>

Después de algunas investigaciones me preguntaba si debería ponerlo en la CSS, por lo que cambió a:

HTML:

<table class="anchors" width="660px"> 
<tr> 
    <td class="left" width="160px">Text 1</td> 
    <td class="right" width="160px">Text 2</td> 
</tr>

CSS:

table.anchors td.left 
{ 
    text-align: left; 
} 

table.anchors td.right 
{ 
     text-align: right; 
}

Todavía no funciona en IE (versión 9, por lo menos). ¿Alguien tiene una pista sobre esto? ¿Debo usar algo más (un div, e.g g)?

Fuente

2012-08-01 jaff

¿te importa hacer un [violín] (http://jsfiddle.net)? – Inkbug

Parece que funciona bien en IE9 incluso el diseño inicial. Agregue borde a su mesa para obtener más imágenes sobre cómo se alinea el texto. –

La forma más rápida de resolver este tipo de problemas es utilizar las herramientas de desarrollo IE (F12). Luego puede hacer cambios en el CSS y ver los resultados en tiempo real a medida que avanza. –

El código es sintácticamente malformada (width atributos toman valores numéricos o porcentuales, no con px unidades), aunque esto indultado por los navegadores . Más en serio, está estableciendo requisitos contradictorios: la tabla debe tener 660 píxeles de ancho, pero consta de dos celdas de 160 píxeles de ancho. No es sorprendente que el comportamiento del navegador sea inconsistente.

Sin embargo, IE 8 e IE 9 se comportan como otros navegadores cuando están en "Modo estándar". De lo contrario, en Quirks Mode, puede pasar cualquier cosa, y no puede llamarlo un error porque el documento no es conforme. Así que agrega una declaración de tipo de documento adecuada.

Además, es mejor evitar los requisitos contradictorios. Si necesita establecer un ancho total en la tabla en píxeles, que así sea. A continuación, establezca el ancho de las columnas para que se sumen o, más simple, configure, p. Ej. los anchos al 50% (para una tabla de dos columnas que debe equilibrarse).

Fuente

2012-08-01 17:04:58

Tenías razón, Jukka. mira los comentarios a mi publicación original anterior. ¡Gracias a todos por las correcciones! – jaff

http://jsfiddle.net/6jvnQ/

se puede cambiar el ancho de la tabla de modo que sea tan ancha como las dos células? Sospecho que obtienes resultados diferentes debido a los anchos raros.

Fuente

2012-08-01 15:57:45

Fue exactamente eso, Jonas. Ver mis respuestas a mi propia publicación para más detalles. ¡Gracias! – jaff

Es un insecto

Este enlace puede ayudarle a

TEXT ALIGN BUGS

Fuente

2012-08-01 16:12:02 Prashobh

La página dice que afecta a IE 6 y 7, pero el OP ha indicado IE 9 –

op dicho, necesita trabajar al menos en ie9. – Prashobh

Era algo más, prash. Ver mis comentarios a la publicación original para más detalles. Sin embargo, gracias! – jaff

uso esto:

padding-left: 22% o 22 píxeles o cualquier longitud

Fuente

2013-02-27 11:18:47 vks

La tabla HTML/CSS alinea correctamente el texto que no funciona en IE

Respuesta

Cuestiones relacionadas