固定幅コンテナを全幅（100％）の親にフィットさせようとしていますか？

Question

私はコーディングに新しいので、内部に固定幅のコンテナを含むいくつかの全幅（100％）のコンテナでWebサイトを作成しようとしています...私は数字とdivで同様に再生しようとしましたが、ワーキング。

これは、サイトのモックアップの画像です：

HTML：：

<div id="wrapper"> 
<header> 

    <div class="header"> 

    .logo 
    .searchbar 
    .phone numbers insert 

    </div> <!--closes header div--> 

</header> 
<div class="navband"> 
<nav> 
    <ul class="nav"> 
     <li><a href="#">Engineered Integrated Solutions</a></li> 
     <li><a href="#">About</a></li> 
     <li><a href="#">Clients</a></li> 
     <li><a href="#">Contact</a></li> 
     <li><a href="#">Employment</a></li> 
    </ul> 
</nav> 

</div> <!--closes navband div--> 
<div class="content"> 

    <h2>Header</h2> 
    <p>Content Here</p> 

</div> <!--closes content div--> 

はCSS：

#wrapper { 
    width: 950px; 
    margin: 0 auto; 
} 

header { 
    width: 100%; 
    height: 175px; 
    background-color: #ff8400; 
} 

#nav { 
margin-top: 280px; 
width: 100%; 
} 

.nav { 
    list-style: none; 
    margin: 0; 
    text-align: left; 
    background-color: #08172d; 
    padding: 5px 0; 
} 
.nav li{ 
    display:inline; 
} 
.nav a{ 
    display:inline-block; 
    padding:10px; 
    color: #fff; 
    font-family: arial; 
    font-weight: bold; 
    text-decoration: none; 
} 
.nav a:hover{ 
    display:inline-block; 
    padding:10px; 
    color: #ff8400; 
    font-family: arial; 
    font-weight: bold; 
} 

ここ

は、私がこれまで持っているコードです。上記のコードは、固定幅のレイアウトを表示します（その背後のボディ全体は白のままです）。bu t私はFigureメソッドを使ったときに起こっていたラッパー（fix-width）を完全に無視することなく、ヘッダー、ナビゲーションバー、コンテンツ領域に個々の全角の親divを含める方法を知らない...何か案は？

Answer 1

あなたは、max-widthプロパティは、要素の最大幅を設定するために使用されて

max-widthプロパティを使用する必要があります。 これは、widthプロパティの値がmax-widthより大きくならないようにします。 注：max-widthプロパティの値がwidthを上書きします。

は

.parent{ 
    width: 100%; 
} 
.child{ 
    padding: 25px 0; 
    margin: 0 auto; 
    max-width: 540px; 
}