Я работаю над сложным дизайном с несколькими слоями, и мне требуется наложить div между двумя другими перекрывающимися div в отдельном контейнере Вот мой упрощенный пример, который работает в Firefox, но не в IE6 (который, конечно, является браузером клиента):
Источник:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
div {
width:200px;
height:200px;
position:absolute;
}
#middle {
background-color:#aaa;
left:30px;
top:30px;
z-index:1;
}
#bottom {
height:200px;
background-color:#777;
left:0px;
}
#top {
background-color:#ccc;
left:40px;
top:40px;
z-index:2;
}
</style>
</head>
<body>
<div id="middle">MIDDLE</div>
<div id="container">
<div id="bottom">BOTTOM
<div id="top">TOP</div>
</div>
</div>
</body>
</html>
Есть ли хитрость, чтобы заставить это работать в IE6? Или такое перекрытие невозможно?
Заранее спасибо