CSS center ul list inside a 100% width div -

CSS center ul list inside a 100% width div -

i sense if have tried text-align center margin:0 auto position relative , width of 100% didn't work, trying center ul within div...

here code

<style type="text/css"> .header{ height:40px; background:#000; width:100%; } .header ul { list-style-type:none; } .header li{ float:left; line-height:40px; } .header li a{ color:#fff; padding:0 18px; height:40px; } </style> <div class="header"> <ul> <li><a href="#">home</a></li> <li><a href="#">about</a></li> <li><a href="#">gallery</a></li> <li><a href="#">services</a></li> <li><a href="#">rates</a></li> <li><a href="#">reviews</a></li> <li><a href="#">faq</a></li> <li><a href="#">contact</a></li> <li> </ul> </div>

this works without having define set width.

ul { display: table; margin: 0 auto; }

if want rid of left-side padding, genuinely centering list, add:

padding-left: 0;

css html-lists