下拉多级悬停问题在IE浏览器,火狐
问题描述:
我已经使用dropfish的superfish,但在IE 8,9和Firefox渲染时出现问题,它在safari和chrome上工作正常,在悬停产品时,锚文本向上移动,我花了几个小时通过修改CSS没有成功,任何人都可以帮助我,我错了,下面是网站:下拉多级悬停问题在IE浏览器,火狐
test-website悬停效应可以在产品子列表上找到。
.sf-menu li a
{
float: none;
border: none;
margin: 0;
display: inline-block;
color: #FFFFFF;
text-decoration: none;
font-size: 11px;
height: 23px;
font-weight: bold;
}
.sf-menu li a:hover
{
display: inline-block;
height: 0px !Important;
text-decoration: none;
font-weight: bold;
line-height: 20px;
padding: 0px 0px 0px 20px ;
float: left;
}
问候
答
变化line-height: 20px;
到line-height: 24px;
.sf-menu li a:hover {
display: inline-block;
float: left;
font-weight: bold;
height: 0 !important;
line-height: 24px;
padding: 0 0 0 20px;
text-decoration: none;
}
编辑。目标嵌套li
.sf-menu ul li ul li a:hover {
padding: 0 0 0 20px;
line-height: 20px;
}
您可能需要使用这些值。
答
你的子菜单没有从哪里下拉的参考点,你指定子菜单的容器作为绝对子菜单以及子菜单ul
本身,我很惊讶它甚至可以在Chrome中运行,试试这个修复它:
.quiklinks li {
position:relative;
}
在您jquery.superfishmenu.css样式,修正以下:
:在下面的类中删除position:absolute
规则
.categoriesHeaderMenu {
position:absolute; /* remove */
}
设置你的子菜单ul
类以下几点:
.categoriesHeaderMenu ul {
position:absolute; /* currently it is set as relative, change it to absolute */
left:0;
}
而且,不知道你是否注意到了这一点,但你包括你的jquery.superfishmenu.css样式表和JS脚本您的子菜单下的菜单应位于标题顶部。
尝试失败 – 2012-03-28 13:40:16
尝试编辑答案 – SMacFadyen 2012-03-28 14:01:25