How to center links in header using CSS? -
i wanted make links centered on screen rather placed in location number of pixels.
here's code:
css:
.horizlinks { position: absolute; top: 77px; left: 180px; } .horizlinks ul { margin: 0px; } .horizlinks li { margin: 0px 15px 0px 0px; list-style-type: none; display: inline; }
this html on webpage:
<div id="container"></div> <div id="header"></div> <div class="horizlinks"> <ul> <li><a href="http://www.website.com">header link 1</a></li> <li><a href="http://www.website.com">header link 2</a></li> </ul> </div>
use text-align:center
on <div class="horizlinks">
. also, set padding of ul
elements 0
.
your absolute positioning of container div pushing whole div side right side of page, unless remove that, content inside never able in middle.
css:
.horizlinks { text-align:center; } .horizlinks ul { margin: 0; padding:0; } .horizlinks li { margin: 0 15px 0 0; list-style-type: none; display: inline; }
Comments
Post a Comment