Adjust width of td to make make row widths even
- by user1729886
I am trying to produce a table with a different number of cells in each row.
The first row is a header row (every other row contains cells). This header is the width of the table.
The second row has 2 cells in it...
the third has 1 cell...
the fourth has 4 cells...
the fifth and final row has 3 cells.
I want the table set up so that the rows span the full width of the table. If the table is 1000px...
The header would be 1000px wide
the cells in the 2nd row would be 500px EACH
the cell in the 3rd row would be 1000px
the cells in the 4th row would be 250px EACH
and the cells in the 5th row would be 333px, 334px, and 333px each (left-to-right)
I figured out I could use colspan for the first 4 rows, but the 5th (with 3 cells) would require a non-integer value. The cells in the 5th row won't expand beyond their column without colspan that I can tell...
trying the width:## CSS code
inside a div tag for each cell
inside the td tag
creating a class or classes that define the cell widths
id-ing each cell, with or without a div tag, and defining widths individually
and adjuting the table-layout: option
After several days, I'm now at my rope's end. The only thing I can come up with is deliberately tripling the number of cells in each row so that colspan would be all integer values. That sounds inconvenient and unreasonably difficult to format the table the way I'd like.
It's a table of Batman movies for a website -- a practice website I'm building, in order to learn HTML/CSS. I've been working on-and-off with HTML for several months, and CSS for a few weeks.
PS: It is not being used for layout, I am simply trying to adjust the layout of the table itself.