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