can't get rid of top and bottom drop shadows

Question

Why with the following code, I still can't get rid of drop shadows at the top and bottom. Although the drop shadows are "small", yet still they are there.

div#inner_container {
 width: 960px;
 margin: 0 auto;
 background-color: rgb(255, 255, 255);
 box-shadow:0 9px 0 0 transparent,
            0 -9px 0 0 transparent,
            12px 0 15px -4px rgba(255, 255, 255, 0.5),
           -12px 0 15px -4px rgba(255, 255, 255, 0.5);
 position: relative;
 z-index: 5000;
}

Answer 1

Try this:

box-shadow: 10px 0px 12px -5px #ffffff, -10px 0px 12px -5px #ffffff;