¿Se mostrará una fila de tabla si todas sus celdas están vacías?

Question

Tengo una fila de tabla vacía solo para la separación entre filas.

<tr> 
    <td colspan="5"></td> 
</tr> 

Se procesa en IE, FF, Opera y Safari. La pregunta es si debería poner algo de contenido dentro o si está bien dejarlo tal como está.

igual:

<tr> 
    <td colspan="5">&nbsp;</td> 
</tr> 

Answer 1

Bien se podría poner   como contenido de la columna para asegurarse de que se muestran las filas. La mejor manera es usar CSS para espaciar.

Answer 2

Puede que ya haya intentado esto pero si intenta agregar algo de espacio entre las filas ha intentado agregar algo de relleno.

CELLSPACING = Longitud (espacio entre células)

CELLPADDING = Longitud (espaciado dentro de las células)

Karl

Answer 3

si quieres poner el contenido en el interior, me gustaría utilizar un espacio sin romper :  , en lugar de un espacio en blanco normal

Answer 4

Semánticamente, ¿sirve la fila vacía para un propósito, o es solo para el diseño? En este último caso, puede valer la pena descartar la fila vacía y proporcionar la separación mediante CSS. P.ej.

<tr class="separate-below"> 
    <td>Data before separater</td><td>More Data</td>... 
</tr> 
<tr> 
    <td>Data after separater</td><td>More Data</td>... 
</tr> 

Con el siguiente en la hoja de estilo:

TR.separate-below TD,TR.separate-below TH { 
    border-bottom: 1em solid white; /* use the background colour of a cell here */ 
} 

Alternativamente, puede utilizar múltiples <tbody> elementos a bloques de grupo de filas juntos (Adición de reglas = "grupos" para el elemento de tabla hace que <tbody> elementos para obtener un borde horizontal en la parte superior e inferior, y <colgroup> elemento para obtener un borde a su izquierda y derecha):

<table rules="groups"> 
<thead> 
    <tr><th>Header</th><th>Header</th>...</tr> 
</thead> 
<tbody> 
    <tr><td>Data</td><td>Data</td>...</tr> 
    <tr><td>Data</td><td>Data</td>...</tr> 
    ... 
</tbody> 
<tbody> 
    <tr><td>Data</td><td>Data</td>...</tr> 
    ... 
</tbody> 
... 
</table> 

Answer 5

Como puedes ver en this example de W3Schools usando el   es la mejor manera de hacer lo que quieras.

Answer 6

Para garantizar que las celdas vacías se muestran el siguiente CSS se pueden utilizar:

table { empty-cells:show; } 

Answer 7

puede utilizar varias etiquetas a tbody filas de la tabla de grupo. Es totalmente válido y más semántico.

Answer 8

Esta es una pregunta muy antigua, pero si alguien todavía necesita una solución (el problema existe con display: table-cell o table-row elements)

aquí está la solución:

.emptyElement:after{ 
    content: "\00a0"; 
} 

Answer 9

que quería añadir mi solución, que es una modificación de la solución @Dariusz Sikorski.

td:empty:after, th:empty:after { 
    content: "\00a0"; 
}