html - how to make a shadowbox stay in the same place when zooming in/out? -

i trying make shadowbox stay in same place if zoom in or out on webpage. tried making sizes in procents rather pixels, dont know combination of properties should use.

this result want achieve: exterior shadow box effect here 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%; 

this page implemented: http://filldevoid.com/test/ (it shown different in same google chrome, on different computers))

(i want shadow box in same place regarding content (i mean, in same position in design, if zoom in) want content nicely inside box, on harpersbazar example.)

add this:

#shadowbox{       width: 970px;     left: 50%;     margin-left: -485px;   }