Hello,
I am having an issue with a table that I cannot quite figure out. I
have a two-column table with the left column comprising of 4 cells and
the right column comprising of one cell with a rowspan of 4 (see
http://72.3.212.120/Example1.html). The first three cells in the left
column will contain content, as will the one cell in the right column.
The fourth cell in the left column is only there to take up the slack
in case the content in the right column is extremely long. Since the
contents of all of these cells are being populated dynamically from a
database, I don't know at design time how much content will exist in
the table.
I would like each of the first three cells on the left to take up only
the height required to display their content, and have the fourth cell
on the left take up the rest of the height. I've tried setting only the
height of the fourth cell on the left to 100% hoping that it would push
the cells above it to the right height, but it did not. I also tried
setting the height of the first three cells on the left to 1% each and
the height of the fourth cell to 97%, but this did not work either.
I can accomplish this with DHTML and javascript if I wanted to (by
checking cell contents at runtime and resizing accordingly), but it
just feels like this should be able to be accomplished with HTML alone.
I know I could also accomplish this with tables nested inside one
another, but I'm trying to keep this as simple as possible for the
admin users who will be updating these tables going forward since they
have little knowledge of HTML and they may be confused by the nested
tables.
Any suggestions would be appreciated. Thank you.