tags:

views:

218

answers:

3

I have a table in a HTML form. It has a fixed height for optical reasons. The number of rows in the table varies depending on the number of form fields available.

Problem: If there are very few rows, all rows are stretched vertically, increasing the space between input elements.

I could avoid this by giving the data rows a (fake) fixed height. I don't like that approach because there is no fixed height I could give it (relative font sizes, accessibility) and I fear future problems - say for example that IE9 decides to take cell heights literally.

What can I do? I have a last (empty) row but no idea what to put in there so that it automatically occupies all "available" space.

A: 

Couldn't you set the cell height to 100% for the last empty row, this should presumably cause that last row to take up the rest of the fixed space

Breadtruck
I'm pretty sure it will take up one page (or viewport) height in Internet Explorer - probably won't work.
Pekka
A: 

I guess this is not doable.

Pekka
+1  A: 

Put heightless table in a div with a fixed height which mimics the table (border? bgcolor?).

By the way, just doing tbody { display: inline; } instead of an empty row works in all real browsers. No, not in MSIE. The tbody element has a lot of shortcomings in MSIE. It also lacks the ability to overflow: scroll; which would be great to have a scrollable table with a fixed header.

BalusC