0
我有一个关于CSS浮动和位置在IE6中的问题,我实现第二级孩子的树视图不会显示到左侧鼠标悬停时,这不会发生在IE7-9和其他浏览器(Mozilla FireFox & Chrome),但IE6。CSS浮动和位置不工作在IE6
请找到下面我的样本树视图代码片段:
<style type="text/css">
.treeView
{
font-family: Century Gothic;
font-size: 13px;
font-weight: bold;
color: #ff6500;
}
/* hyperlink style */
.treeView a
{
color: #ff6500;
text-decoration: none;
}
/* hyperlink hover style */
.treeView a:hover
{
color: #ff6500;
text-decoration: underline;
}
.treeView ul
{
list-style: none;
margin: 0;
padding: 0;
width: 246px;
}
.treeView ul li
{
height: 100%;
background: #def0f6;
position: relative;
float: left;
width: 100%;
z-index: 3;
}
/* item background color */
.treeView li
{
background: #def0f6;
border-top: 1px solid #007dc6;
border-left: 1px solid #007dc6;
border-right: 1px solid #007dc6;
}
.treeView ul li a, .treeView ul li span
{
display: block;
padding: 5px 8px 5px 15px;
}
/* hide and align child item, and child width */
.treeView ul ul
{
position: absolute;
top: -1px;
visibility: hidden;
}
/* item background color when hover */
.treeView li:hover
{
background: #ffffd8;
}
/* display child item when hover parent item */
.treeView li:hover > ul
{
visibility: visible;
}
/* align 2nd child item to left when hover parent item */
.treeView li:hover ul
{
display: block;
left: 246px;
}
</style>
<div class='treeView'>
<ul>
<li><span class='submenu'>Level 1</span>
<ul>
<li><a href='#' class='submenu'>Level 2</a>
<ul>
<li><a href='#'>Level 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
我怀疑这是由于CSS的float:左和位置:相对。 任何想法如何float:在IE 6中工作?请帮忙
谢谢高级。
接近2013年,您仍在使用IE6。这是一个悲伤的日子。 – Marwelln 2012-07-25 09:51:20
上帝忘记IE6现在..这是刺激... – 2012-07-25 09:53:33
这是一个互联网面临的网站,解决方案必须支持IE和跨浏览器的多个版本 – sams5817 2012-07-25 09:58:12