html - How to center nav in div -


i trying center navigation bar in middle of div body. want navigation bar go 1 side of div other have list in ul center in middle of div if makes sense. can't seem figure out after trying online examples. thanks

body {      margin: 0px;      padding: 0px;      background-color: #505050 ;  }    #body {      width: 75%;      margin: 0 auto;      position: center;      background-color: #c0c0c0;      height: 100%;  }    .nav {    }  .nav ul {      background-color: #cccccc;      width: 100%;      padding: 0;      text-align: center;    }    .nav li {      list-style: none;      font-family: arial black;      padding: 0px;      height:40px;      width: 120px;      line-height: 40px;      border: none;      float: left;      font-size: 1.3em;      background-color: #cccccc;      display:inline;    }    .nav {      display: block;      color: black;      text-decoration: none;      width: 60px;    }
<div id="body">      <h2>hello world!</h2>      <div class="nav">          <ul>              <li><a href="#">home<a></li>              <li><a href="#">about<a></li>              <li><a href="#">news<a></li>              <li><a href="#">contact<a></li>          </ul>      </div>  </div>

i attach fix here http://jsfiddle.net/o4716uo9/

use inline-block li


Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -