Forum Moderators: open
<html>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="105">
header's code
</td>
</tr>
<tr>
<td style="height: 100%;" valign="top" align="left">
if (some condition)
<div id="dimensionDiv" style="height: 400; top: 106; left: 0; position: absolute; z-index: 0; visibility: visible;">
else
<div id="sourceDiv" style="height: 400; top: 106; left: 0; position: absolute; z-index: 0; visibility: hidden;">
</td>
</tr>
<tr>
<td height="115">
footer's code
</td>
</tr>
</table>
</body>
</html>
When I use in 1152x864, there is no problem, because is a very high resolution, but if I change to 800x600, the two divs in the middle, expand to cover the footer. ¿Why is happen this?
Sorry, for my poor english...
That's certainly a tricky layout. By giving the div a position:absolute, you have removed it from the normal flow of the document. Even though you have a height attribute, when the window gets narrower, the content requires more than that height to be rendered -- that is, you have an overflow.
Since you have not instructed the browser's rendering engine what to do with the overflow content, it just expands the height of the div beyond your declared height (as is correct). And since the div is position:absolute, the table cell's height is not stretched or affected -- and the footer is therefore overlapped with the extra absolute div content.
In short, I think you need to re-think the layout syntax. Combining table cells and absolute divs is the problem. I don't know exactly what you are trying to achieve, but can you have the content in the <td> itself so the cell can accommodate whatever space is needed?
- In mozilla 1.8 there is everything OK
- In Netscape 7 the footer sometimes appear and when I refresh the page not .... is odd.
Help me
