Как мне наложить фон Div?

Question

Здесь у меня есть два div с фоновыми изображениями css для обоих.Я пытаюсь сделать так, чтобы элементы div перекрывались, чтобы иметь возможность наложения точечных рисунков.Я чувствую, что делаю это правильно, но впереди неправильный div.Любые идеи, почему это происходит?

Вот веб-сайт: http://designobvio.us/portfolio/body.html

HTML:

<section class="bodySection">
 <div id="body-wrapper" class="container_12">

  <div id="left-container" class="grid_5">
   <div class="content">
   </div>
  </div><!--end of left-container-overlay-->
 </div><!--end of left-container-->
</div><!--end of body-wrapper-->

</section><!--end of bodySection-->

Мой CSS:

 #left-container {
    background:url(../img/sliderBG.png)transparent repeat;
    width:400px;
    height:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    box-sizing:border-box;
    position:absolute;
    overflow:hidden;
    display:block;
    height:100%;
    top:0;
    z-index:5;
}
#left-container .content {
    background:url(../img/Me.jpg) repeat-y;
    width:400px;
    height:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    box-sizing:border-box;
    position:absolute;
    overflow:hidden;
    display:block;
    height:100%;
    top:0;
    z-index:1;
}

Спасиборебята!

Answer 1

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

Смотрите эту скрипку, чтобы узнать, как это сделать: http://jsfiddle.net/GCprD/

Answer 2

Хотя это невозможно сделать с вашей HTML-структурой!

http://jsfiddle.net/GCprD/1/

Но я согласен, что решение m90 лучше.