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
Post a Comment