放大/缩小时如何让影子盒停留在同一个地方？

Question

即使我在网页上放大或缩小，我也试图让影子盒停留在同一个地方。 我试着在程序中制作尺寸而不是像素，但我不确切知道应该使用哪种属性组合。

这是我想要实现的结果：来自此处的外部阴影框效果http://www.harpersbazaar.com/

#shadowbox {
margin: 5px 450px 5px;
box-shadow: 0px 0px 5px rgba(150, 150, 150, 0.75);
position: relative;
z-index: 0;
width: auto;
border-top: 1px solid rgb(223, 223, 223);
initialHeight: 100%;

这是实施它的页面：http://filldevoid.com/test/（它在相同的谷歌浏览器中显示不同，但在不同的计算机上显示））

（我希望阴影框与内容在同一个地方（我的意思是，即使我放大了，在设计中处于同一位置）我希望内容在框内很好，就像在harpersbazar例子。）

Answer 1

添加：

#shadowbox{


    width: 970px;
    left: 50%;
    margin-left: -485px;


}

Answer 2

试试这个

 #shadowbox{
   width:1060px;
   margin:0 auto;
    box-shadow:0 0 5px rgba(150, 150, 150, 0.75);
   border-top:1px solid #DFDFDF;
    z-index:1;
   position:relative;
        }