CODEWITHSUNDEEP
htmlcss
Zak
Zak

Reputation: 2698

How do you make a 100% width table with the columns all equal width?

I'm trying to make a table that stretches 100% of the page (or whatever container it's in, depending on where I use it).

When I specify the width of the table to 100%, it automatically resizes the columns based on the width of their content. This is nice most of the time when I wouldn't mind different width columns, but for this, I need all of the columns to be the same width. I know that I could specify a percentage width for the columns, but I need this to work for any number of columns.

Here's my code so far: http://jsfiddle.net/zwWHZ/2/

Is it possible to have a table with a width of 100% and equal column widths without having to specify the percent for each column with pure CSS?

Upvotes: 11

Views: 7637

Answers (1)

Jeremiah Willcock
Jeremiah Willcock

Reputation: 30969

I tried putting table-layout: fixed; into the table section of the CSS, and that appeared to work (even when I changed the number of columns). The source where I found that is here.

Upvotes: 23

Related Questions