html - How can I evenly space out the elements of my navigation bar using the width attribute? -
here's simulation: http://jsfiddle.net/lq9dp/
and here's html , relevant css sections respectively: html:
<div id="footer"> <div class="nav_wrapper"> <ul id="list_orientation"> <li><a href="http://www.facebook.com">facebook</a></li> <li id = "portfolio_text"><a href="http://www.google.com">portfolio</a></li> <li><a href="http://www.google.com">email</a></li> </ul> </div> </div> css:
#heading{ font-family:'chunkfiveromanregular'; position: absolute; font-size:80px; top: 10%; left: 0px; width: 100%; height: 1px; text-align:center; } .border{ border-top: 5px dashed #000000; border-bottom:5px dashed #000000; padding:20px; } body{ background:#ffdd22; } #subheading{ font-family:'museoslab500regular'; text-align:center; font-size:25px; } .nav_wrapper{ position:relative; margin:auto; /*width:30%;*/ /*change width:30%;*/ } .nav_wrapper ul li {display:inline; width:30%;} .nav_wrapper ul li {width:30%;} #footer{ width:100%; float:left; position:fixed; bottom:0; z-index:100; } #list_orientation { padding:0; margin:0; height:5%; }
you mean this? http://jsfiddle.net/lq9dp/13/
Comments
Post a Comment