CSS-центр ul list внутри ширины 100% div

Question

Мне кажется, что я пробовал все: от text-align center до margin:0 auto с относительной относительной и шириной 100%, но они не сработали, я пытаюсь сосредоточить мою улицу внутри ДИВ ...

Вот мой код

<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> 

Answer 1

Это должно исправить это для вас.

ul { 
    display: inline-block; 
    margin: 0 auto; 
} 

Если это не работает для вас, то дать UL установленную ширину т.е.

ul { 
    width: 300px; 
    margin: 0 auto; 
} 

Answer 2

Это работает без задаете ширину.

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

Если вы хотите, чтобы избавиться от левой боковой прокладки, таким образом, действительно центрирования список, добавьте:

padding-left: 0;