框阴影到div容器

时间:2017-02-08 06:10:12

标签: html css css3

  

我正在尝试用盒子阴影效果来实现一个盒子div。

我设法在css上做了,虽然由于某种原因容器看起来与我的方块网格不对齐。如果有人能够检查我做错了什么就会很棒!

完整代码here

 .square-container {
  width: 350px;
  position: absolute;
  top:50%;
  left:50%;
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
  -ms-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);

}

所以我正在尝试的是一个带有框阴影效果的容器中的正方形网格。

1 个答案:

答案 0 :(得分:2)

选中此JS Fiddle

CSS

 .trigger {
  float:left;
  }
 .panel {
  /*margin-top:47px;*/ 
 }

 .panel .front {
 /*position: absolute;*/
 }