javascript - IE7,8 中的下拉菜单需要修复'

标签 javascript css internet-explorer

过去,我在让 IE 正常运行方面取得了很多成功,但我在这里很吃力。下拉菜单可见且有效,但存在一些边距/填充问题,无论我尝试使用哪种条件语句或 hack,它都不会理顺。

示例页面:www.erisdesigns.net

HTML(删除链接以便我可以发布):

<div id="wrapper">
<div id="header">
    <ul id="nav">
    <dl class="dropdown">
      <dt id="one-ddheader" onmouseover="ddMenu('one',1)" onmouseout="ddMenu('one',-1)"></dt>
      <dd id="one-ddcontent" onmouseover="cancelHide('one')" onmouseout="ddMenu('one',-1)">
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
      </dd>
    </dl>
    <dl class="dropdown">
     <dt id="two-ddheader" onmouseover="ddMenu('two',1)" onmouseout="ddMenu('two',-1)"></dt>
      <dd id="two-ddcontent" onmouseover="cancelHide('two')" onmouseout="ddMenu('two',-1)">
        <ul>
          <li></li>
          <li></li>
          <li></li>
        </ul>
      </dd>
   </dl>         
  </ul>
  </div>

CSS:

#nav {
    top:80px;
    width:65%;
    margin-left:600px;
    padding:0;
    background:#999;
    text-align:center;
    list-style:none;
    position:relative;
    z-index:3;
}

.dropdown {float:left; text-align:center; font-size:14px; padding-right:5px; color:#FFF;}
.dropdown dt {width:175px; padding:8px; font-weight:bold; cursor:pointer; background:transparent;}
.dropdown dt:hover {background:transparent; color:#000;}
.dropdown dd {position:absolute; width:175px; display:none; background:transparent; z-index:200; opacity:0;}
.dropdown ul {width:175px; margin-top:23px; list-style:none;}
.dropdown li {display:inline-block; margin-left:-108px; float:left; padding-left:35px; text-align:left;}
.dropdown a, .dropdown a:active, .dropdown a:visited {display:inline-block; padding:5px 0px 10px 15px; color:#CCC; text-decoration:none; background:#999; width:175px; float:left;}
.dropdown a:hover {background:#999; color:#000;}
.dropdown a.menu {background:transparent; width:200px; float:left; text-align:left; color:#FFF;}
.dropdown a.menu:hover {color:#000}

最佳答案

我的标记太多了。尝试替换 <ul id="nav"><div id="nav">因为你没有用 <li></li> 包装任何东西所以 IE 可能有一些问题。

关于javascript - IE7,8 中的下拉菜单需要修复',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2975767/

相关文章:

javascript - 创建一个新函数并从另一个函数调用参数

javascript - 如何声明一个带有构造函数和子对象的类?

javascript - 选择下拉列表在 IE9 中扩展很长

php - IE 未在 HTML 页面上正确应用 css/脚本(适用于 .php)

css - 来自 document.styleSheets.length 的样式表计数在 IE 和 Chrome 之间不同

javascript - Typescript嵌套函数包装返回类型问题

javascript - 动态更改 following-mouse-div 的颜色,与其下方的颜色互补

html - 导航菜单 : css vertical centering

jquery - bxSlider 在首次加载 Chrome 时无法工作

javascript - 子 div 掩盖了对其父 div 的点击