template etiquetas definicion body attribute html css css-tables

html - etiquetas - ¿Es válida la implementación del modelo de borde colapsado en los navegadores web?



html title attribute (1)

La respuesta es no." Me encanta la franqueza de las discusiones mantenidas por el CSSWG, y las notas sobre el borrador actual del borrador de los editores de las Tablas 3 de CSS le informan todo lo que necesita saber sobre esta pregunta.

Dado que los navegadores manejan esto de manera tan diferente, la convergencia no puede ocurrir sin la reimplementación. ...

… Algunas combinaciones no son problemas bien planteados, por lo que ningún algoritmo de renderizado podría ser óptimo.

Debido a que pasaron de ser algo simple (HTML) a algo muy complejo (HTML + CSS), los modelos actuales de renderizado de tablas ... utilizados por los navegadores web son una locura (en el sentido de que son defectuosos, no son interoperables y no tienen CSS). Muchas suposiciones de CSS habituales se rompen y las representaciones divergen ampliamente.

(Énfasis añadido.)

Hay mucha más información en el borrador actual, pero el Grupo de Trabajo de CSS reconoce (1) que las implementaciones del navegador son inconsistentes, y (2) incluso su propia propuesta actual es insuficiente.

He estado tratando de entender este extracto de la especificación CSS 2.2 por un tiempo sin éxito (la selección en negrita es mía):

Las UA deben calcular el ancho inicial del borde izquierdo y derecho de la tabla al examinar la primera y la última celda en la primera fila de la tabla. El ancho del borde izquierdo de la tabla es la mitad del borde izquierdo colapsado de la primera celda, y el ancho del borde derecho de la tabla es la mitad del borde derecho colapsado de la última celda. Si las filas subsiguientes tienen bordes de izquierda y derecha colapsados ​​más grandes, entonces cualquier exceso de derrames en el área del margen de la tabla.

El ancho del borde superior de la tabla se calcula al examinar todas las celdas que colapsan sus bordes superiores con el borde superior de la tabla. El ancho del borde superior de la tabla es igual a la mitad del borde superior máximo contraído.

Y así es como se implementan las fronteras, el colapso, etc. en Chrome (FF e IE> 7 son lo mismo):

table { border: 6px solid green; border-spacing: 0; border-collapse: collapse; } #cell_1_1 { border: 28px solid red; } #cell_2_1 { border: 12px solid chartreuse; } #cell_2_2 { border: 2px solid cyan; }

Mientras esperaba algo como esto:

Esperaba que el borde izquierdo de la mesa tuviera un grosor de 14 px. Debido a que el borde izquierdo contraído de la primera celda #cell_1_1 tiene un ancho de 28 px ( el ancho del borde izquierdo de la tabla es la mitad del borde izquierdo contraído de la primera celda ) y en el borde izquierdo se divide entre la celda y la tabla. Entonces visualmente, la tabla tiene un borde de 28 px cerca de la primera celda, pero 14 px pertenecen al borde de la primera celda. Y luego el borde permanece igual para todo el lado izquierdo de la tabla. Si los bordes de algunas celdas son más anchos, entonces sobresalen hacia la izquierda, sin afectar el borde izquierdo de la tabla.

Lo mismo con el borde superior.

También pensé que el problema puede estar relacionado con la palabra inicial en el extracto, es decir, estas reglas solo se aplican en caso de que una tabla no tenga un borde específico, pero resultó que no está relacionada (la eliminación de la regla de estilo de borde de la tabla simplemente quitado el borde verde en absoluto).

Entonces, ¿alguien podría responder a las siguientes preguntas?

  • ¿Son correctas las implementaciones de este modelo de bordes colapsados ​​en Chrome, FF, IE?

  • si son correctas, ¿qué hay de malo en mi comprensión de la especificación?

Ahora, si fuéramos viceversa y asumiéramos la implementación en Chrome como punto de partida para derivar la especificación, esta parte debería haber sido algo similar a la siguiente (solo he conservado la parte relevante para el borde izquierdo para la sucinta):

Las UA deben calcular el ancho inicial del borde izquierdo y derecho de la tabla, que luego se utiliza para colocar la tabla en relación con su bloque que contiene examinando la primera y la última celda en la primera fila de la tabla. El ancho del borde izquierdo de la tabla es la mitad del borde izquierdo contraído de la primera celda después de todos los conflictos de borde, si alguno se ha resuelto

...

Si las filas subsiguientes tienen bordes de izquierda y derecha colapsados ​​más grandes, entonces cualquier exceso de derrames en el área del margen de la tabla.

...

Todos los bordes que se derraman en el margen se tienen en cuenta al determinar si la tabla desborda algún ancestro (consulte ''desbordamiento'') , pero no afecta la posición de la tabla en relación con su bloque que lo contiene.

Entonces el extracto habría tenido sentido.

Aquí hay una tabla con el borde más ancho que la de la primera celda dentro de un bloque contenedor con el fondo rosado (como podemos ver, el borde de la tabla se elige sobre el borde de la primera celda porque es más ancho y luego este borde se utiliza para colocar la tabla dentro del contenedor. Los bordes más anchos de las celdas subsiguientes sobresalen más allá del borde de la tabla):

Y aquí está la misma tabla con el borde de la primera celda más ancha que la de la tabla, que se elige sobre ella durante la resolución del conflicto de la frontera. Y aquí este borde se utiliza para colocar la tabla en relación con el contenedor: