2010-09-07 7 views
23

Quiero diferentes estilos en cada columna de una tabla. He leído que puede hacer eso usando <colgroup> o <col>, pero no tuve suerte. Tengo un ejemplo here, y nada parece cambiar. ¿Estoy haciendo algo mal? ¿Funcionará esto en xhtml?El elemento colgroup de la tabla HTML no funciona?

Sé que podría agregar un atributo de "clase" en cada <td>, pero parece débil.

Respuesta

32

Eso es correcto. Mientras que colgroup es compatible con todos los navegadores, this isn't true for the attributes of the inner col element. De los atributos posibles, solo width es compatible con todos los navegadores. Pero a diferencia de CSS, <col width=""> solo admite anchuras de píxeles y porcentajes.

No lo uses. En su lugar, cree clases CSS y asígnelas a cada td. Sí, apesta.

EDITAR Actualizado enlace anterior a la página con una mejor información

+0

thxs! parece que html5 hará que funcione el colgroup ... pero hasta entonces, usaré clases o el nth-child – pleasedontbelong

+3

La página a la que se refiere dice _La etiqueta es compatible con todos los principales navegadores_ Tal vez debería eliminar la referencia, porque son desinformando a la gente –

+0

Estoy de acuerdo con @JannieT, esto parece ser compatible con todos los principales navegadores. Consulte: http://reference.sitepoint.com/html/colgroup y http://webdesign.about.com/od/htmltags/p/bltags_colgroup.htm –

5

Indica tu table-layout de automóviles en lugar de fijo ...

table {table-layout: auto;} 

Mi sitio personal compatible con varios temas y veo este tipo de diferencias todo el tiempo.

+1

Fantástica propiedad! :) https://developer.mozilla.org/en-US/docs/Web/CSS/table-layout –

1

Puede usar los selectores de CSS para obtener resultados similares sin agregar clases adicionales.

Como ejemplo, si usted quiere dar estilo específico a una segunda columna que puede utilizar:

table>tbody>td:nth-child(2){font-weight: bolder;} 
Cuestiones relacionadas