100% width div scrollbar

Posted by Cpu86 on Stack Overflow See other posts from Stack Overflow or by Cpu86
Published on 2012-06-23T09:12:29Z Indexed on 2012/06/23 9:16 UTC
Read the original article Hit count: 127

Filed under:
|

I'm making a webpage with a fixed background and a scrollable centered text.

I first set the html and body style:

html, body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}

and then comes the page:

<body>
<div style="position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; z-index:0;">
<img src="background.jpg" align="center" width="100%" height="100%" />
</div>
<div style="position:absolute; left:0; top:0; right:0; bottom:0; width:100%; height:100%; overflow:auto; z-index:1;">

Under Safari, Chrome, Firefox and Opera works great. Under IE8 (i don't have the chance, neither i do really want, to test under IE7, IE9 and so on...) are displayed two vertical scrollbars one next to the other:

enter image description here

Is there a solution to this crap?

© Stack Overflow or respective owner

Related posts about html

Related posts about internet-explorer