开发者

DIV absolute position works in IE, Chrome but not FF

开发者 https://www.devze.com 2022-12-11 05:25 出处：网络

I wanted to set a 2-tone, full-window background to my page: <body> <div style=\"position: absolute; width: 50%; height: 100%; top: 0%; left: 0%; z-index:-1;background-color: 96C3FF\"><

相关专题：css

I wanted to set a 2-tone, full-window background to my page:

<body>
<div style="position: absolute; width: 50%; height: 100%; top: 0%; left: 0%; z-index:-1;background-color: 96C3FF"></div>
<div style="position: absolute; width: 50%; height: 100%; top: 0%; left: 50%; z-index:-1;background-color: BEC0C2">开发者_如何学运维</div>
<div id="mainDiv">...</div>
</body>

This works great on Chrome and IE8 but not on FF3. I thought maybe I need to set the height on body to 100%, but that doesn't help.

If I remove the z-index, they're visible properly on all 3 browsers but drawn on top of mainDiv... and setting mainDiv's z-index to 1 doesn't do anything.

I didn't think any of this was that unusual... any ideas?

Works fine in Firefox for me too, but there are some other things you could look at, although unrelated to this problem: