In Firefox 2, usage of overflow:hidden makes other divs overlap current div
Posted
by Shankar
on Stack Overflow
See other posts from Stack Overflow
or by Shankar
Published on 2010-06-05T19:19:56Z
Indexed on
2010/06/05
19:22 UTC
Read the original article
Hit count: 400
Hi, When I use overflow:hidden for div which is positioned absolute (for menu), other div overlaps. Here is the code. It works fine in FF3. Any help appreciated. Please note that html should be as it is. Also if you can provide solution, just by changing styles of menu div (the div which contains menu text) it is more helpful for me. Thanks in advance
Here is the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<div style="position:relative">
<div>
<div style="height:20px;overflow:hidden">
<div style="position:absolute;width:200px;height:100px;top:0px;background-color:black;z-index:1">menu</div>
</div>
</div>
<div style="position:relative;height:200px;background-color:gray;"></div>
</div>
</body>
</html>
© Stack Overflow or respective owner
