CSS - 前のliの下にcentering li

Question

私は以前のliの下にliをドロップダウンメニューの中心に置こうとしています。私が思いつくことができる最も良いことは、リストを左に動かすために負のマージンを使用することですが、これは一様には機能しません。何か案は？

http://empact.mcallinder.com/empact.php

#navigation { 
    height: 50px; 
    width: 960; 
} 
#navigation ul li { 
    display: block; 
    float: left; 
    padding: 0 40px; 
} 
#navigation ul li ul { 
    display:none; 
    width: 240px; 
} 
#navigation li:hover ul { 
    display:block; 
    position: absolute; 
    margin: 0 0 0 -35px; 
    padding: 0; 
} 

Answer 1

を、あなたは#navigation ul liためposition:relativeを追加する必要があり、その後、

left: 50%; 
margin-left: -52px; 

を使用して #navigation li:hover ulを配置します

そうすることで、まず、ポジションulを親の半分に合わせてliとし、その寸法に従って左に移動します。

Answer 2

このコーディング試してください：あなたのケースでは

#navigation ul li { 
    border: 1px solid black; 
    display: block; 
    float: left; 
    padding: 0 30px; 
    width: 80px; 
}