javascript - IE9上的JQUERY水平菜单

Question

我使用了以下 JQUERY UI 水平菜单示例： 如何使 jQuery UI 导航菜单水平？ 这在 Chrome 上效果很好，但在 IE 9 中它看起来很糟糕而且它不是水平的你知道我错过了什么吗？

我的 JQUERY 来源：

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

我的CSS：

#menu li 
{ 
    width: auto;
    clear: none;
    background:blue;
    margin-right:3px;
    margin-left:3px;
    margin-top:2px;
    float: left;
}

.menuIconItem 
{
    cursor:hand;
}

.liMenuItem
{
    background-color:transparent;
}

.menu
{
    border: 0px !important;
    background:D0E1F7 !important;
}

我的代码：

<ul id="menu" class="menu">
    <li class="liMenuItem" title="1">
    <a onclick="menuItemClicked('1');" class="menuIconItem">
    <img src="1.png" id="img1">
    </a></li>
    <li class="liMenuItem" title="2">
    <a onclick="menuItemClicked('2');" class="menuIconItem">
    <img src="2.png" id="img2">
    </a></li></ul>

谢谢 ：）

Answer 1

请参阅以下链接了解更多详情，

跨浏览器菜单

它告诉您对于 IE，您必须对 css 文件进行更改，因为某些东西可能无法在 IE 中正常工作，

ul.dropdown ul li { 
    display: inline; 
    width: 100%; /* Width depends on the size of containing block */
}

试试这个希望它有帮助..