使用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/