Wed, 2004-05-12 04:58
Hello I have a table with two rows.
The top row should stretch horizontally all the way to the edge of the screen, no matter how wide the screen is (including a horizontal scrollbar).
For some reason, it is cut off.
here is a sample code that shows what I am talking about:
<html>
<body>
<table border="1" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td width="100%">title</td>
</tr>
<tr>
<td style="position:relative;width:100%; height:100%; z-index:0;">
<!-- here I place some div at specific screen coorinates (some of them may span to the right of the screen -->
<div style="position:absolute; left:500px; top:40px;width:700px;height:20px"></div>
</td>
</tr>
</table>
</body>
</html>
Note that I placing an obsolutely positioned div at such a coordinate and with such size, so that it forces the screen to have a horizontal scrollbar (very good). However, the top row of the table only streches until the edge of the screen, and doesn't continue all the way (if you scroll horizontally).
can anyone know how I can fix this?
I must use absolute positioning for the divs.
thanks in advance
Wed, 2004-05-12 11:36
#1
how to cause a header to stretch horizontally?
When something is absolutely positioned it is taken out of the natural flow of the html.
The table will stretch to the width of the veiwport whatever size that is, but in essence does not see the absolute positoned div.
The browser recognises that it needs to give the viewer a horizontal scrollbar, but does not recognise it needs to stretch the table.
Regards
Day