8

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

Just to be clear, I know I can do <td style="width:150px">, but this does not keep the column width fixed. No matter what the contents of the cell are, I want the width fixed at 150px.

Improve this question

3 Answers 3

Reset to default
6

You can use width on col. Depending upon what you are doing it may also be helpful to use a fixed width child of the <td> to enforce its width as this does not work by setting the width of <td> alone due to its table-cell display type.

http://jsfiddle.net/ywSvr/

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Width on <col> is not supported in HTML5 (w3schools.com/tags/att_col_width.asp)
@Hosea146 not the width attribute, but CSS width on the <col> like in the example I linked you
Ok. Yes I see. Thank you. However, this is going to be very tedious. My table has about 10 columns, each of which will have a different fixed width. And, I have a couple tables I want to do this for. So, creating a CSS definition for each of this is going to be a pain. Is there another way?
You can use the style attribute on <col> as well. <col style="width: 150px;">
6

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>
Improve this answer

Comments

1

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

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.