2 деления проблемы с тенью

Question

У меня есть 2 div, где первый находится сверху, а второй ниже этого ...

Я добавил тень к первому div, который находится сверху и выглядит хорошо.

box-shadow: 0px 5px 5px #000000;
-moz-box-shadow: 0px 5px 5px #000000;
-webkit-box-shadow: 0px 5px 5px #000000;

Но когда я добавляю градиент css ко второму div, который находится ниже, первый теряет свою тень ... или я не знаю, что происходит ...

Мне нужно иметь возможность увидетьтень от первого без добавления поля ко второму элементу ниже.

Спасибо

РЕДАКТИРОВАТЬ: Моя разметка:

<div id="header">
   <div class="960width"></div>
</div>
<div id="content">
   <div class="960width"></div>
</div>

Мой CSSэто:

#content{
    background: #e5e5e5;
    background: -moz-linear-gradient(top, #e5e5e5 0%, #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5e5e5), color-stop(100%,#ffffff));
    background: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);
    background: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);
    background: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff',GradientType=0 );
    background: linear-gradient(top, #e5e5e5 0%,#ffffff 100%);
    padding-top:15px;
}

#header{
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5));
    background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );
    background: linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
    padding:5px;
    box-shadow: 0px 5px 5px #000000;
    -moz-box-shadow: 0px 5px 5px #000000;
    -webkit-box-shadow: 0px 5px 5px #000000;
}

Answer 1

Это HTML-теги:

<div id="top">
        <div id="back">
            [Content]
        </div>
</div>

с вашим CSS все было в порядке, вам нужно всего лишь изменить свой HTML-тег, если вы это сделаете, ваша проблема исправлена ​​... посмотрите на эту скрипку , я думаю, это то, что вы имели в виду ...

PS: если вы дали ширину верхнему DIV, вы увидите тень справа и слева ...

PS2: я меняю имя "ID" ...