IE reserves space for scrollbar in frame
I have a frame-set and each frame has a table with width:100%. In IE 8 and 9, the table does not fill the whole window, but instead has a strange right margin. In all other browsers it worked fine.
I confirmed that it is not related to margin/padding and is to do with scrollbar because if I change the scrollbar width in the control panel, the reserved space changes too. If the page is viewed outside of frame this problem will not happen.
This is lagacy code. Each frame has scrolling=auto. From the internet I saw two related discussions:
- vertical scrollbar problem in IE
- Reserved space for vertical scrollbar in IE
However I still can't find a solution. Adding scroll=no to the body of the page will eliminate the space, but this prevents scrollbar from showing when needed. I tried a few other solution but c开发者_开发知识库an't find a fully working one yet.
EDIT: This only happens in vertical split frame.
Sample Code:
index.html
<html>
<frameset rows="150,*" cols="*" framespacing="0" border="0" frameborder="no">
<frame scrolling="auto" noresize src="top.html" name="menu">
<frame scrolling="auto" noresize src="bottom.html" name="main">
</frameset>
</html>
top.html
<html>
<body marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 bgColor="#AAFFAA">
<table cellspacing=0 cellpadding=0 width="100%" border=1>
<tr>
<td width="100%" align=middle>TOP<td>
</tr>
</table>
</body>
</html>
bottom.html
<html>
<body marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 bgColor="#FFAAAA">
<table cellspacing=0 cellpadding=0 width="100%" border=1>
<tr>
<td width="100%" align=middle>bottom<td>
</tr>
</table>
</body>
</html>
Sorry i cant comment under the question.
Did you try to replace the scrolling with an oveflow?
try adding a style overflow: auto: or overflow-x: auto; overflow-y: hidden;
加载中,请稍侯......
精彩评论