ボックスの影をdivコンテナに移動

Question

ボックスシャドウ効果でボックス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%); 

}

それでは、私が持ってしようとしていると、ボックスシャドウを持つコンテナ内の正方形のグリッドが影響しています。助けのための

Answer 1

チェックこのJS Fiddle

CSS

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

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