ヘッダーがフルサイズでない場合リサイズ

Question

ヘッダーがフルスクリーンで表示されますが、ブラウザーのサイズを変更するとヘッダー（およびフッター）がフルページにまたがって表示されません。誰がなぜこれが分かっていますか？

min-widthに数字「960px」を設定すると、問題が解決されますが、小さなブラウザではページが極端に長くなります。

.header { 
 
background-color: #0d0d0d; 
 
border-bottom-style: solid; 
 
border-bottom-width: 2px; 
 
border-color: #e1e1d0; 
 
border-opacity: 0.8; 
 
min-width: 100%; 
 
} 
 

 
.header img { 
 
margin: 20px 10px; 
 
} 
 

 
.header ul { 
 
padding: 10px 0; 
 
float: right; 
 
list-style-type: none; 
 
} 
 

 
.header li { 
 
font-size: 15px; 
 
margin: 35px; 
 
display: inline-block; 
 
text-decoration: none; 
 
text-shadow: 5px; 
 
}

<div class="header"> 
 
    <div class="container-fluid"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
     <img src="http://i.imgur.com/66ceGOS.png?1" alt="TS Logo" style="width:75px;height:75px;"> 
 
      <ul> 
 
      <li><a href="default.asp">Home</a></li> 
 
      <li><a href="news.asp">Public Artwork</a></li> 
 
      <li><a href="contact.asp">Installation & Exhibition Work</a></li> 
 
      <li><a class="active" href="#about">Profile</a></li> 
 
     </ul> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

あなたは最小幅の前に追加することができます。

width: 100%;