html - tables - Firefox 4 y table-layout: arreglado

table css

Question

Tengo un problema que parece haberse introducido entre Firefox 3 y 4. Esencialmente tiene que ver con table-layout: fixed .

Tengo una tabla desplazable que utiliza dos DIV, uno para el encabezado y otro para el cuerpo (lamentablemente es la única opción que funcionó para mí).

La tabla del cuerpo se ve algo así (tenga en cuenta que todo esto se genera con JavaScript, es parte de una aplicación GWT):

<table style="table-layout: fixed;">
    <colgroup>
        <col width="61" />
        <col width="57" />
    </colgroup>
    <tbody>
        <!-- data -->
    </tbody>
</table>

(por cierto, la página está declarada como HTML 4.01 Transitional)

Parece que en Firefox 3, se respetan los anchos de las columnas. Sin embargo, en Firefox 4 parece ignorar el ancho de las columnas en algunas ocasiones (es difícil de precisar exactamente, pero generalmente cuando la tabla comienza a ser lo suficientemente pequeña como para que Firefox pueda cambiar el tamaño). Si inspecciono el ancho de las columnas en Firefox, generalmente tienen poca relación con los anchos especificados en el HTML.

Me pregunto si alguien puede arrojar alguna luz sobre por qué esto podría estar pasando.

Answer 1

¿Por qué no usas esto?

display:table;
posiiton:fixed;

Y para la etiqueta col, usa CSS:

<col style="width:61px;" />
<col style="width:57px;" />

Answer 2

Es posible que necesite px después del número en FF 4. Pruebe esto:

    <col width="61px" />
    <col width="57px" />

Answer 3

Lo primero es asegurarse de que su marcado valide. Utiliza el estilo "/>" SHORTTAG, que no es válido en HTML 4.01 (esos cierres solo son válidos en XHTML).

No sé si la etiqueta breve inesperada forzará al navegador al "Modo Quirks" (compruebe la información de la página ... ¿lo tiene?)? El modo Quirks es la muerte a la resolución de problemas.

Si su FireFox tiene instalada la extensión Web Developer, inspeccionaría la tabla y todo lo que contiene ... podría ser que algo esté presionando las paredes de la columna.

No puedo seguir adivinando el problema ... no hay suficientes datos. Sería útil si guardase el HTML completo del navegador (luego quite cuidadosamente los bits innecesarios o confidenciales) y luego verifique que el problema aún ocurra en el caso de uso más simple. Si es así, publique ese caso de uso en la web en alguna parte y las personas pueden inspeccionarlo.

Aparte de las etiquetas cortas, no has revelado que estás haciendo algo mal. Pero como sugerí, probablemente haya algo dentro del cuerpo de la mesa ...