修复IE中的下拉对齐

时间:2012-08-08 14:09:21

标签: html css internet-explorer drop-down-menu

我目前正致力于一些客户工作,并且我使用了我构建的简单下拉菜单。除了IE之外,它似乎在大多数浏览器中都能正常工作。调试一直是一个真正的痛苦,因为IE并没有真正提供太多的洞察力,我无法指出确切的问题。

下拉列表是一个包含position: absolute且包含三个<ul>的div。根据我的判断,div的位置正常,但是第一个ul是它应该的宽度的两倍,没有明确的原因,因此看起来整个dropwdown都没有正确排列。

下拉列表可在此处找到:fatumdemo.platonlearning.com。移动顶部菜单中的菜单项(蓝色),您可以看到问题。

这里的代码非常冗长,但是如果需要有关结构和CSS的更多信息,我很乐意发布它。

2 个答案:

答案 0 :(得分:0)

乔伊,

1)#navigation ul li ---&gt;添加位置:相对属性

2)#navigation ul li .dropdown -----&gt;放宽:450px至500px

3)#navigation ul li .dropdown ul -----&gt;放宽:160px或更高。

主要问题原因是宽度和相对,当你添加绝对位置时,相对是父元素的必须,宽度和高度必须是绝对元素

答案 1 :(得分:0)

问题在于我使用li以外的元素作为ul的子元素。 Internet Explorer显然不能容忍这种行为,与所有其他浏览器不同,并将其他元素视为列表项,因此我的下拉列表被放入IE中错误的列表项中。