html - コンテナを拡張 Div に配置する方法は?

Question

これは写真で説明するのが一番です！asldskd が入ったボックス、赤い部分の場所になりたいです。ロゴを黒い領域に配置し、別のコンテンツを緑の領域に配置したいと考えています。私は基本的に黒と緑の拡張機能を持ちたいのですが、コンテンツを 900px コンテナー内に配置したいと考えています。

これは私が今持っているものです。これを行うためにz-indexを使用してみました。黒緑色のバーを 900px コンテナーの外側に強制する方法はありますか、それともコンテナーをその下に保持する必要がありますか?

<div id="header"> laksjdf</div>
<div id="subheader"> alskdjf</div>

<div id="container">
asdf
</div>

そしてここにcssがあります：

#header {
width:100%;
height:70px;
background-color:black;
position:relative;
z-index:0;
 }

#subheader {
width:100%;
height:25px;
background-color:green;
position:relative;
z-index:1;
 } 

#container {
width:900px;
margin:0 auto;
border:1px solid black;
position:relative;
z-index:1;
 }