Insertar una fila de la tabla en blanco con una altura menor

Tengo una tabla que consta de una fila de encabezado y un par de filas de datos. Lo que quiero hacer es crear una fila en blanco entre el encabezado y las filas de datos, pero quiero que esta fila en blanco sea más pequeña en altura que las otras filas (para que no haya un espacio tan grande).Insertar una fila de la tabla en blanco con una altura menor

¿Cómo puedo lograr esto?

Mi código de marcado HTML de la tabla es la siguiente:

<table class="action_table"> 
    <tbody> 
     <tr class="header_row"> 
      <td>Header Item</td> 
      <td>Header Item 2</td> 
      <td>Header Item 3</td> 
     </tr>    
     <tr class="blank_row"> 
      <td bgcolor="#FFFFFF" colspan="3">&nbsp;</td> 
     </tr> 
     <tr class="data_row"> 
      <td>Data Item</td> 
      <td>Data Item 2</td> 
      <td>Data Item 3</td> 
     </tr> 
    </tbody> 
</table>

Fuente

2012-03-16 Ed.

Simplemente añadir la regla CSS (y la ligera mejora mark-up) publicado por debajo y deberías obtener el resultado que buscas.

CSS

.blank_row 
{ 
    height: 10px !important; /* overwrites any other rules */ 
    background-color: #FFFFFF; 
}

HTML

<tr class="blank_row"> 
    <td colspan="3"></td> 
</tr>

Como no tengo idea de lo que se ve su hoja de estilo actual como he añadido la propiedad !important por si acaso. Sin embargo, si es posible, debe eliminarlo ya que rara vez se quiere confiar en las declaraciones !important en una hoja de estilo, teniendo en cuenta la gran posibilidad de que la estropeen más adelante.

Fuente

2012-03-16 14:22:06 Tom

Esto funciona y es más compatible con mi codificación actual. –

Prueba esto:

<td bgcolor="#FFFFFF" style="line-height:10px;" colspan=3>&nbsp;</td>

Fuente

2012-03-16 14:18:57

En XHTML 1.0 Strict, el atributo 'style =" "' no está autorizado. Su código debe ser el mismo para cualquier tipo de documento. –

@FrederickMarcoux ¿Estás bromeando? Según XHTML 1.0 Strict, ¡el atributo 'style' es el único atributo correcto en el ejemplo de Barry! –

Según mi curso de HTML, en XHTML Strict, no podemos usar el atributo 'style'? –

No necesita una fila de tabla adicional para crear espacio dentro de una tabla. Ver this jsFiddle.
(Hice el espacio de color gris claro, para que pueda verlo, pero puede cambiarlo a transparente.)

Usando una fila de tabla solo para mostrar es el abuso de mesa!

Fuente

2012-03-16 14:32:05

Tiene razón y me gusta la elegancia de su solución. Necesito un poco de separación en el resto de la mesa también. Entonces, dada la compatibilidad con mi codificación actual, voy a tomar el camino más fácil. –

-4

no pude conseguir nada a trabajar hasta que probé esta línea simple:

<p style="margin-top:0; margin-bottom:0; line-height:.5"><br /></p>

que le permite variar la altura de la línea de llenado a su contenido corazones (me [probablemente el mal uso de la tabla de conseguir tres columnas (cajas) de texto que luego que quería alinearse a lo largo de la parte inferior)

soy un aficionado por lo apreciaría comentarios

Fuente

2015-01-15 22:11:08

Debería haber reconocido la fuente: http://www.gokgs.com/help/_it_IT/EditorsTipsAndTricks.html - pero parece que no tienen una ruta de contacto ... y parece que es un poco de alto poder la configuración del juego ... y hasta ahora he evitado esa ruta adictiva desde que me quedé despierto toda la noche ~ hace 30 años con Space Invaders –

FYI, cuando quieras tener el código fuente en tu respuesta, sangra esa línea con 4 espacios al principio Esto le permitirá tener etiquetas < > – shiser

sé que esta pregunta ya tiene una respuesta, pero descubrí una aún más simple forma de hacer esto .

Sólo añadir

<tr height = 20px></tr>

en la tabla en la que desea tener una fila vacía. Funciona bien en mi programa y es probablemente la solución más rápida posible.

Fuente

2017-04-16 19:59:42

Insertar una fila de la tabla en blanco con una altura menor

Respuesta

Cuestiones relacionadas