HTML5 - How to specify a fixed width for a specific cell?

Question

In HTML5, how can I specify a fixed width for a table cell? Most of the <col> properties that were available in HTML4 are no longer valid in HTML5.

To be clear, I know I can do <td style="width:150px"> , but this does not allow fixing the column width. Regardless of the contents of the cell, I want the width to be fixed at 150 pixels.

Answer 1

You can use width in col . Depending on what you are doing, it may be useful to use a child with a fixed width of <td> to ensure its width, since this does not work if you set only the width of the <td> because of its table-cell display type.

http://jsfiddle.net/ywSvr/

Answer 2

Use colgroup

 <table> <colgroup> <col span="1" style="width: 15%;"> <col span="1" style="width: 70%;"> <col span="1" style="width: 15%;"> </colgroup> <thead></thead> <tbody></tbody> </table> 

Answer 3

Use the table algorithm of the other by adding table-layout: fixed :

• How to set a constant width of a table column regardless of the amount of text in its cells?
• my previous answer with a demo (this was for the div displayed as a table, but this is the same as the table element displayed by default)