CSS下拉菜單在IE8中未對齊

我有一些下拉菜單似乎並沒有在IE8中很好地對齊 - 它們在Firefox 3和IE7中很好地對齊。具體來說，下拉菜單似乎忽略了我的權利：0;樣式。一張圖片勝過千言萬語，所以這是什麼樣子：CSS下拉菜單在IE8中未對齊

Misaligned menu http://lh5.ggpht.com/_gXJgvXl6JFY/TEf9v1BmECI/AAAAAAAAAA4/iGF-Wi8CTyU/misaligned%20menu.png

正如你可以看到，下拉的右側，應該與強調「管理」裏的右邊對齊，但它似乎在中間。

重要下拉CSS樣式：

.ajs-menu-bar .ajs-drop-down { 
left:auto; 
right:0; 
}

重要的「管理員」李風格是：

.ajs-menu-bar .ajs-menu-item, .ajs-menu-bar .ajs-button { 
float:left; 
list-style-image:none; 
list-style-position:outside; 
list-style-type:none; 
position:relative; 
}

而對於該位的HTML是：

<li class="normal ajs-menu-item"> 
<a href="#" class="user trigger ajs-menu-title" id="user-menu-link"><span><span>admin</span></span></a>   
<div class="ajs-drop-down" style="width: 111px;"> 
<ul class="section-user-status first" id="user-menu-link-user-status"> 
... bunch of <li>s    
</ul> 
</div> 
</li>

如果任何人都可以擺脫一些光線會很好，只是讓我有點堅果:(。

在此先感謝!!!!

乾杯，珍妮

來源

2010-07-22 jenny

我會建議在菜單專門針對IE8的一個單獨的樣式表。這是對IE8進行更改的唯一方法，而不是其他顯示正常的瀏覽器。

下面大概的代碼是不準確的（關於挑出一個瀏覽器），但它應該給你一個想法，該怎麼辦...

<![If lt IE7]> 
    <link href="ie8.css" type="text/css" rel="stylesheet" /> 
<![End If]-->

一旦你做到了這一點，複製的CSS您的菜單到這個文件（是），並更改頁邊距下拉：

.ajs-menu-bar .ajs-drop-down { 
left:auto; 
right:0; 
margin-right: 40px !important; 
}

如果更改如下所示不起作用，嘗試左邊距設置爲負值，右頁邊距。我知道，這個想法看起來很可笑，但在我對Liquid Design的研究中，我發現它有時是唯一正確的方法。

HTH

來源

2010-07-22 10:49:51

感謝堆！我可能無法完全像這樣使用條件包含，因爲我在sitemesh中工作，但是我得到了這個想法和CSS。兒！ – jenny 2010-07-23 00:57:52

正如羅賓威廉姆斯在「雙世人」中所說的......人們很高興能夠成爲服務對象。^_ ^ – 2010-07-23 06:30:57

CSS下拉菜單在IE8中未對齊

回答

相關問題