我试图让阴影出现在我的 div 下。到目前为止，它适用于除铬/铬以外的任何东西。简单地说，绘制阴影的 div 并没有按应有的方式显示，即使设置了 z-index 属性，阴影也会出现在div 上。Html 看起来像这样：
<body>
<div id="header" class="box clear">
<div id="logo">
<img class="obraz_srodek" src="http://ocento.hol.es/tz/logotyp.png" title="ocentologotype"/>
</div>
</div>
<div class="content">// Javascript/jQuery soon</div>
<div id="test">Padding test</div>
我的css文件是这样的：
body
{
background-image:url('bg.jpg');
background-repeat: repeat;
}
html{
height: 100%;
width: 98%;
padding:0;
margin:0;
}
body {
min-height: 100%;
min-width:98%;
}
.content{
padding-top:55px;
}
.obraz_srodek {
overflow:hidden;
height:25px;
display: block;
margin-left: auto;
margin-right: auto;
padding-top:7px;
}
#header
{
position: fixed;
background-color: white;
min-height: 40px;
min-width: 100%;
top: 0px;
left: 0px;
}
.box {
position: relative;
background-color: #fff;
box-shadow: 0 0px 5px rgba(0,0,0,0.25), 0 0 5px rgba(0,0,0,0.1) inset;
border-radius: 1% 1% 1% 1% / 1% 1% 1% 1%;
}
.box:after {
position: absolute;
width: 80%;
height: 40%;
left: 10%;
border-radius: 50%;
z-index: -4;
bottom: 0%;
content: "";
box-shadow: 0 7px 16px rgba(0,0,0,0.4);
}