垂直於CSS3

Question

我'對齊試圖創建一個子菜單導航菜單，而今天它撥弄。 但我堅持讓父菜單的子菜單對齊它的鏈接。

我的HTML

<!-- navigation menu --> 
<div class="MenuContainer"> 
     <ul class="menu"> 
       <li><a href="#">Home</a></li> 
       <li><a href="#">About</a></li> 
       <li> 
         <a href="#">Projects</a> 
         <ul class="sub"> 
           <li><a href="#">Project1</a></li> 
           <li><a href="#">Project2</a></li> 
           <li><a href="#">Project3</a></li> 
         </ul> 
       </li> 
     </ul> 
</div> 

我的CSS

.MenuContainer { 
    width:100%; 
    height:50px; 
    border:1px solid; 
    position:relative; 
} 

ul { 
    margin:0; 
    padding:0; 
} 

/*Main menu*/ 
li.menu { 
    height:50px; 
    float:left; 
} 

ul.menu li { 
    list-style:none; 
    float:left; 
    height:49px; 
    text-align:center; 
} 

ul.menu li a { 
    display:block; 
    padding:0 20px; 
    text-align:center; 
    font-size:17px; 
    line-height:49px; 
    text-decoration:none; 
    color:#5d5d5d; 
} 

ul.menu li:hover > a { 
    color:#fdfdfd; 
} 

ul.menu li:hover > ul { 
    display:block; 
} 

/*sub menu*/ 
li.sub { 
    height:40px; 
    float:left; 
} 

ul.sub li { 
    list-style:none; 
    float:left; 
    height:39px; 
    text-align:center; 
} 

ul.sub li a { 
    display:block; 
    padding:0 20px; 
    text-align:center; 
    font-size:17px; 
    line-height:39px; 
    text-decoration:none; 
    color:#5d5d5d; 
} 

如果有人能告訴我哪裏出了問題，請做。第一次嘗試從頭創建一個。

此外，如果任何人都知道一個良好的HTML5/CSS3論壇/論壇，請不要猶豫，發佈鏈接。我試圖找到一些，但都不是認真的或沒有活躍的用戶。

而且這是我第一次計算器後，如果我在這裏做一個初學者的錯誤，請只是指出來。

感謝上前進。

Answer 1

嘿，我想你想這樣做的太陽類position relative和子UL給position absolute

.sub{ 
position:absolute; 
} 


ul.menu li { 
    position:relative; 
} 

現場演示http://jsfiddle.net/HVk4G/

---

垂直菜單更新演示http://jsfiddle.net/HVk4G/1/