In Firefox 2, usage of overflow:hidden makes other divs overlap current div
- by Shankar
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>