使用css爲web.sitemap自定義默認菜單樣式

Question

我使用web.sitemap來顯示asp.net應用程序的菜單，該菜單看起來很好，但默認情況下，主菜單項的子菜單將垂直顯示，如下所示。

但我想顯示子菜單水平爲。我正在嘗試改變與CSS。但它並沒有改變。該div的主要類是mainmenu。爲了自定義這個，我使用下面的CSS。

.mainmenu ul li ul li{ 
position:relative; 
float:left; 
} 

但它不會在左邊。即使它不起作用，我也會給出display:inline。我們不能自定義來自web.sitemap供應商的菜單嗎，還是我在這裏做錯了？ 這裏的JS Fiddle link

Answer 1

有很多內聯樣式您的HTML覆蓋您的CSS類和ID。我設法找到水平顯示level2 li項目的快速修復程序，但這只是暫時的，因爲我需要找出是什麼導致level2 ul不能對齊到菜單的左側。將此放在你的CSS文件：

li.dynamic{ 
    display:table-cell; 
} 

而這裏的演示：http://jsfiddle.net/y2GjA/1/

我會看看我能爲更好的解決辦法做，因爲這只是一個臨時的解決方案，並與IE8及以上的不兼容。

- 編輯 -

以下內容添加到您的CSS：

li.static:nth-child(6):hover ul.level2{ 
    left:-481px!important; 
} 
li.dynamic { 
    display:table-cell; 
} 

和這裏的演示：http://jsfiddle.net/uSmSD/