Filas de tabla HTML: ¿cómo hacer que una celda única tenga un ancho del 100%? (Con las explicaciones pantalla)

Question

Aquí está mi problema: Tengo una tabla HTML que se ve así:

Lo que quiero es que haya una fila de la tabla adicional por debajo de ella, excepto que esta fila se extiende por el ancho completo de la tabla, pero con solo una celda. Rápidamente me burlé de hasta un ejemplo:

Como se puede ver añadí otra fila de la tabla de abajo con un solo <td> celular en el interior que contiene el texto. Sin embargo, quiero que esta celda abarque el 100% del ancho de toda la tabla, no debe cambiar el tamaño del ancho de la columna 'Nombre'.

¿Es posible? Me complace usar jQuery o Javascript si es necesario; también, esto no necesita funcionar en IE ya que cada usuario usa Chrome (aunque eso sería una ventaja).

Jack

Answer 1

En su caso, usted haría algo como

<tr> 
    <td colspan="5">This text should be as long as the entire table's width...</td> 
</tr> 

El atributo colspan dice el número de columnas de la célula debe asumir. Debería funcionar en todos los navegadores compatibles con tablas, ya que es HTML estándar.

En JavaScript, establecía la propiedad colSpan de la celda o llama al .setAttribute("colspan", the_number_of_columns). Cualquiera de los dos debería funcionar Pero a menos que esté generando la celda dinámicamente, debe incluir el atributo colspan en su HTML.

Answer 2

Para una celda para abarcar todas las columnas 5,

<td colspan="5">Lorem Ipsum</td>