2010-07-22 11 views
21

Hay una mesa con este aspecto:IE8 ignora td width, funciona en IE7

<table width="100%"> 
<tr id="header"> 
<td colspan="2"></td> 
</tr> 
<tr id="center"> 
<td id="left" style="width: 201px"></td> 
<td id="mainpage" style="width: 100%"></td> 
</tr> 
</table> 

En todos los navegadores (incluyendo IE7), aparte de IE8 td "izquierda" está muy bien. En IE8 excede el ancho de acuerdo con el contenido de la página principal.

Publicaba algunas capturas de pantalla pero es mi primera publicación aquí.

¿Alguna idea de lo que sea?

+0

cómo quiere hacer el ancho total de la tabla 201px + 100% ?? –

+0

Yo no. Pero este diseño corrige el problema IE7. Y no afecta IE8. – Bill

Respuesta

41

Ese width: 100% en la segunda columna no se ve bien: si está intentando hacer que la segunda columna se expanda al resto del espacio disponible, no debería necesitarla para poder eliminarla. Además, añadir esto a su mesa:

table-layout: fixed; 

para asegurarse de que las anchuras son obedecidas.

código completo:

<table style="width: 100%; table-layout: fixed;"> 
<colgroup> 
    <col style="width: 201px"> 
</colgroup> 
<tr id="header"> 
    <td colspan="2"></td> 
</tr> 
<tr id="center"> 
    <td id="left"></td> 
    <td id="mainpage"></td> 
</tr> 
</table> 
+0

Pensé en esto y lo intenté, pero una vez que configuré el diseño de la tabla como arreglado, las dos columnas obtienen el mismo ancho (50%) e ignora los valores fijos. El 100% de la segunda columna está allí como una solución para IE7. – Bill

+0

Pruebe la solución editada con cols adicionales, no es una solución terriblemente buena, pero funciona. – Razor

+0

¡De hecho lo hace! Parece mejor que mi solución, iré con eso. Gracias! – Bill

0

¿Seguro que debe ser 100%

<table width="100%"> 

La tabla será tan grande como su elemento padre. Puede ser que usted debe establecer un ancho fijo para la tabla:

<table width="600"> 
+0

La tabla reside en un div que se adapta a toda la pantalla. – Bill

0

Si define un ancho a su mesa y su primera no es necesario definirlo para su segundo.

Supongo que el segundo obtiene el 100% del contenedor que es la tabla.

0

Bueno, problema de manera fija mediante la adición de una mesa vacía con un ancho fijo dentro de la MainPage.

De esta forma, en realidad estoy estableciendo un min-width para la actitud de ignorar del IE independientemente. Gracias por todas las respuestas.

Cuestiones relacionadas