我有一个盒子阴影的问题,被另一个 div 遮住了。
这是我的代码:
HTML-
<div id="wrap">
<div id="header">
<div id="nav"></div>
</div>
<div id="main_content"></div>
<div id="footer"></div>
</div>
CSS-
body{
margin:0;
}
#wrap{
margin:0 auto;
width:84%;
}
#header{
background-image:url(img/header_pattern.png);
background-repeat:repeat;
margin:0 auto;
width:100%;
height:170px;
box-shadow:5px 5px 5px black;
z-index:1;
}
#main_content{
background-image:url(img/main_pattern.png);
background-repeat:repeat;
width:100%;
min-height:700px;
height:100%;
z-index:2;
}
截屏-
http://i.stack.imgur.com/TfDyi.png
我怎样才能使阴影不会“堆叠在”(在z轴上),因此被#main_content
div遮挡,但仍然在我的内部#wrap
?
谢谢。
不,我不只是不想#main_content
推倒。