Equal sized table cells to fill the entire width of the containing table

Viewed 218632

Is there a way using HTML/CSS (with relative sizing) to make a row of cells stretch the entire width of the table within which it is contained?

The cells should be equal widths and the outer table size is also dynamic with <table width="100%">.

Currently if I don't specify a fixed size; the cells just autosize to fit their contents.

4 Answers

Just put this lines to your table style:

#table_name{
    table-layout: fixed;
    width: 100%;
}

You have a good example on this codepan.

This is late answer, but it will help for future searches.

Related