让这个CSS在IE6中工作
正在处理此页面:并且在IE6中导航时遇到问题。它验证为XHTML1.0过渡版。在FF、IE 8、Chrome和Windows Safari中工作非常出色。在IE6和Opera 10中,下拉菜单显得太高 我尝试添加不同版本的,但它并没有解决IE中的问题 CSS如下所示:让这个CSS在IE6中工作,css,Css,正在处理此页面:并且在IE6中导航时遇到问题。它验证为XHTML1.0过渡版。在FF、IE 8、Chrome和Windows Safari中工作非常出色。在IE6和Opera 10中,下拉菜单显得太高 我尝试添加不同版本的,但它并没有解决IE中的问题 CSS如下所示: #wrapper { position: relative; display: block; background-color: inherit; margin: 0px auto; pad
#wrapper {
position: relative;
display: block;
background-color: inherit;
margin: 0px auto;
padding: 0;
width: 900px;
min-height: 900px;
}
#nav {}
.navImage {
position:relative;
display:inline;
height:102px; /* added in hopes of helping IE position but no dice */
}
.subMenu {
position:absolute;
z-index:10;
background-color:#FFF;
top: 14px;
left:0;
}
.subMenu a:link, .subMenu a:visited, .subMenu a:active{
display:block;
width:90%;
padding:6px;
margin:0;
color:#3CF;
font-family:Tahoma, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
font-weight:bold;
}
.subMenu a:hover{
display:block;
width:90%;
padding:6px;
margin:0;
color:#3CF;
background-color:#CCC;
font-family:Tahoma, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
font-weight:bold;
}
jQuery滚动:
$('#navcompany').hover(function () {
$('#companyMenu').css('display', 'block');
$('#companyImg').attr('src','g/nav/company_over.gif');
}, function () {
$('#companyMenu').css('display', 'none');
$('#companyImg').attr('src','g/nav/company.gif');
});
还有一个细胞。由于菜单来自PHP,IE不考虑宽度,所以我只使用PHP获取导航图像宽度,并将其动态写入样式。解决了宽度问题,IE表现得好像应该从包装器继承宽度一样。这可能是一个线索,为什么他们没有出现在他们的导航图像,但我不能排序
<div id="navcompany" class="navImage" style="width:128px">
<a href="about.php">
<img src="g/nav/company_over.gif" name="companyImg" width="128" height="102" border="0" id="companyImg" alt="company" />
</a>
<div id="companyMenu" class="subMenu" style="display:none; width:128px">
<a href="about.php">About us</a>
<a href="location.php">Our location</a>
</div>
</div>
非常感谢您的建议
JG
您正在使它成为一个内联DIV,但它实际上不是一个内联DIV。它更像是一个display:block代码>
在IE6中,navImage
被渲染为一个块,这就是您看到差异的原因
您应该使.navImage
a显示:块代码>和使用浮动:左代码>
还记得清除你的浮动
然后您的top:14px
将更改为top:102px代码>谢谢!这绝对解决了问题。我的布局创造了更多,但我现在走在正确的道路上!非常感谢!
.navImage {
position:relative;
display:inline;
height:102px; /* added in hopes of helping IE position but no dice */
}