View Full Version : Overflow problem?

02-09-2006, 01:22 AM
Hi, I'm new to this forum, and to CSS, in fact. Help!

Here's the problem--within a <td>, I have 4 or 5 <div>'s all relatively positioned; they're arranged in the right places, but the <td> that contains them has a lot of dead space at the bottom of the page. I'm pretty sure the <td>'s height is what it would be if none of the <div>'s positions were changed.

I tried adding "display: inline" to the divs, but that created more problems. Then I tried adding "overflow:" with every value to the divs, then the <td>, but that did nothing.

Am I right in thinking this is an overflow problem? Anyone have any ideas? Thanks in advance.


02-14-2006, 12:03 PM
A table cell's height will be the height of the highest table cell in its row. If it is adjacent to a high cell, it will be as high as that cell. If it is alone or the highest cell, its height will be determined by its contents and/or in some browsers, its height attribute or property, set neither if you want the contents to determine the height. If the contents are relatively positioned, the cell will still allow for all the room the contents would have needed if their positions were normal (static). To adjust contained divisions in a table cell so as to affect its height, set things like their margins, negative values can be used. If a divisions top margin is negative, it will appear higher up than usual, if its bottom margin is negative, things below it will appear higher. Sometimes, in some browsers, overlapping of invisible areas of divisions can occur in these situations rendering the visible sections of some divisions to be obscured. If this happens set all divisions to position:relative; but do not set a left or top property. Then add a z-index:10 property. These values (the 10 in my example) can be positive or negative but using only positive values is best for this exercise. Higher z-index values (relative to the obscuring division(s)) will allow obscured divisions to 'rise above' and become visible again.

02-14-2006, 07:50 PM
Thank you, js! Setting the margin-bottom to a negative value worked perfectly!