Не удалось центрировать a в a li

Question

Я пытаюсь центрировать a в пределах li в меню навигации. Это не работает. Вот мои соответствующие css:

#access ul li ul { 
    position: absolute; 
    background-color: #fff; 
    border-top: 4px solid #2980b9; 
    top: 55px; 
    left: 0px; 
    width: 190px; 

} 

#access li:hover 
{ 
background: #2980b9;  
} 

#access a { 
display: block; 
     margin-left: auto; 
margin-right: auto; 
} 

Любые мысли об этом?

Для HTML см панели пилить в http://phasetransfercatalysis.com

Answer 1

Для этого нужно, чтобы элемент был явно рассчитан на этот трюк.

a{ 
    dispaly:block; 
    margin-left:auto; 
    margin-right:auto; 
    width:40px; 
} 

http://jsfiddle.net/Zyw6y/2/

Answer 2

У вас есть два варианта, по крайней мере.

Первый вариант, установите ширину вашего a как так

#access a { 
    width: 60%; 
} 

---

Второй вариант, вы можете переработать свой код и установить text-align: center на родителя, который является li и сделать a inline- чтобы он выполнял заказы от li, чтобы выровнять по центру.

#access li { 
    text-align: center; 
} 

#access a { 
    display: inline-block; 
}