html - Add a full width image above a Bootstrap navbar -


i trying insert image above navbar, not working me. here html:

  <div class="wrapper" />   <div class="navbar">     <div class="navbar-inner">       <div class="container">         <ul class="nav">           <li class="active">             <a class="brand" href="#">home</a>           </li>           <li><a href="#">about</a></li>           <li><a href="#">portfolio</a></li>           <li><a href="#">contact</a></li>         </ul>       </div>     </div>   </div> 

and css:

.wrapper {   background-image: url(../assets/bridge.jpg);   background-repeat: no-repeat;   background-size: 100% 100%;   width: 100%;   height: 250px; } 

anytime add div or content, pushed top of page. can add padding, when start resize screen breaks , leaves gap in image , navbar. great.

<div /> means <div> in html 5 , not <div></div> in xhtml. div's not valid self closing tags.

ref

demo

<div class="wrapper"></div> <div class="navbar">     <div class="navbar-inner">       <div class="container">         <ul class="nav">           <li class="active">             <a class="brand" href="#">home</a>           </li>           <li><a href="#">about</a></li>           <li><a href="#">portfolio</a></li>           <li><a href="#">contact</a></li>         </ul>       </div>     </div>   </div> 

Comments

Popular posts from this blog

Winapi c++: DialogBox hangs when breaking a loop -

vb.net - Font adding using PDFsharp -

javascript - jQuery iScroll clickable list elements while retaining scroll? -