2014-11-06 43 views
1

我需要沿着頁面長度對齊下拉菜單。我有一個菜單:無法沿着頁面長度對齊下拉菜單

<ul class="nav navbar-nav menu"> 
     <li><a href="#">About the company</a> 
      <img src="images/arr1.png" ></img> 
      <ul> 
       <li class="first_li"><a href="#">Mission</a></li> 
       <li><a href="#">History</a></li> 
       <li><a href="#">Vacancy</a></li> 
       <li><a href="#">Best Experts</a></li> 
      </ul> 
     </li> 
    </ul> 

然後,我有一些CSS樣式,使這個下拉菜單是對齊我右吼聲它manner.But無法正常工作。

.menu li{ 
    list-style: none; 
    float: left; 
    line-height:84px; 
} 


.menu li:hover > ul { 
    display: block; 
    background-color: rgb(231,231,231); 
    position:absolute; 
    top:84px; 
    left : 0px; 
    width: 100%; 
    text-align:center; 
    padding:0; 
    z-index:1; 
} 

.menu .language:hover > ul { 
    display:block; 
    width:84px; 
    line-height:30px; 
} 
+0

你可以做一個小提琴嗎? – JonH 2014-11-06 19:39:16

+0

@JonH真的嗎?您使用html代碼填充html和css區域。 – 2014-11-06 19:42:22

+0

這是我執行更新時發生的一個錯誤:http://jsfiddle.net/z2ycjgj5/4/ – JonH 2014-11-06 19:45:50

回答

0

問題的一部分看起來像你在'懸停'部分有大部分列表樣式。嘗試把它放到一般的菜單樣式中。

+0

它沒有幫助 – Sofiia 2014-11-06 20:21:16