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

Perl - how to grep a block of text from a file -

delphi - How to remove all the grips on a coolbar if I have several coolbands? -

javascript - Animating array of divs; only the final element is modified -