0

我试图让阴影出现在我的 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);
      }
4

1 回答 1

1

像这样的东西？我移动了 div.box 的效果，chrome 不能用你的方法 jsFiddle 来做

<div id="header" class="clear">
    <div class="box">
        <div id="logo">
            <img class="obraz_srodek" src="http://ocento.hol.es/tz/logotyp.png" title="ocentologotype"/>

        </div>
    </div>
</div>
于 2013-05-15T08:40:59.047 回答