html - How to get nav bar to float to the left of container div without absolute positioning -


i trying nav bar sit left of container div (and header img) without having position pixels (as seen here in codepen: http://cdpn.io/bfkzx). i'd design flow responsively, i'd center main divs (container/ header img) , have nav hang out on left, i'm having no luck making happen.

thank you!

do have keep html structure same? can following:

<div class="wrap">   <div id="nav">     <ul>       <li><a href="#">link</a></li>       <li><a href="#">link</a></li>       <li><a href="#">link</a></li>     </ul>   </div>  <div id="body">     <img src="http://placehold.it/600x150" />      <div id="container">       <img src="http://placehold.it/600x800" />     </div>  </div> </div><!--//end wrap--> 

with css follows (i've removed list styles brevity's sake):

.wrap {    overflow: hidden;   width: 800px;   margin: auto auto; }  #nav {    width: 160px;   float: left; }  #body {   width: 80%;   float: left; } 

you can adjust top margin of #nav bump down.


Comments

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

node.js - Getting the socket id,user id pair of a logged in user(s) -

keyboard - C++ GetAsyncKeyState alternative -