Добавление границы тени к моей обертке

Question

У меня есть #wrapper, в котором содержится весь контент страницы, и я бы хотел разместить другой div вокруг него с помощью границы тени, #shadowwrap. Я смотрел на этот материал в пути к долгой сегодня, и мой мозг застрял ...

#shadowwrap { 
    background:url("images/shadowborder.png") repeat-y center; 
    background-color:transparent; 
    max-width:1000px; 
    min-width:1000px; 
    min-height:100%; 
    margin:0 auto; 
    position:relative; 
} 

#wrapper { 
    background-color:#FFF; 
    width:100%; 
    max-width:980px; 
    min-width:980px; 
    min-height:100%!important; 
    margin:0 auto; 
    margin-bottom:-50px; 
    position:relative; 
    overflow:auto; 
} 

сайт: http://www.hcfmissoula.com

Спасибо.

Answer 1

Вы могли бы сделать вашу жизнь намного проще, просто применяя тени к #wrapper элемента следующим образом:

#wrapper { 
    /* shadowborder.png should be 1000px wide (10px of shadow on either side and 
     980px of white to create the solid background colour) */ 
    background: url("images/shadowborder.png") repeat-y 0 0;   

    /* The 10px of left and right padding + 980px of width will result in a 
     1000px wide #wrapper */ 
    padding: 0 10px; 
    width: 980px; 

    /* remaining CSS. I removed min-width and max-width because they were 
     both the same value and therefore didn't do much ;) */ 
    min-height: 100% !important; 
    margin: 0 auto; 
    margin-bottom: -50px; 
    position: relative; 
    overflow: auto; 
}