html - Header not full width resize -
my header fine on full screen - when resize browser, header (and footer) not span full page. know why is?
if set min-width
number, "960px", solves problem, makes page super long, small browser.
.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>
can add before min-width:
width: 100%;