IE6、IE7下的z-index问题_html/css_WEB-ITnose

IE6 IE7 z-index 浏览器兼容 有html结构如下：

		
			left		
		
			

					
						
															鼠标经过时，显示div														
								...							
						
					
					
						right					
									
				
					
						
															鼠标经过时，显示div														
								...							
						
					
					
						right					
									
			
			

相关的css:

	.wrap{		border:1px solid red;		height:300px;		padding:10px;		width:500px;	}	.fl-wrap{		border:1px solid green;		float:left;		height:100px;		width:50px;	}	.fr-wrap{		border:1px dashed blue;		float:right;		height:300px;		width:440px;	}	ul{		margin:0;		padding:0;	}	.fr-wrap li{		border:1px solid #000;		height:100px;		list-style-type:none;		margin:5px;		padding:5px;			}	.clear{		clear:both;		height:0;		overflow:hidden;	}	.fr-wrap .fl{		border:1px dashed red;		float:left;		height:100%;		width:140px;	}	.fr-wrap .fr{		border:1px dashed blue;		float:right;		height:100%;		width:260px;	}	.fl .pmt-wrap{		position:relative;		*z-index:2;	}	.fl .pmt{		cursor:pointer;		font-size:12px;		margin:5px;		padding:0;		position:relative;		z-index:1;	}	.fl .pmt-detail{		background-color:#fff;		border:1px solid #ccc;		height:200px;		left:5px;		position:absolute;		top:16px;		width:100px;		z-index:3;	}	.hidden{		display:none;	}

火狐下的效果：（也是希望得到的效果）


IE6、IE7下的效果：


已经有按照网络上查到的方法，给.pmt-wrap加上了z-index，但是好像不起作用

回复讨论(解决方案)

IE6下，需要给父层添加z-index才行，但如果在css加，因为是class，所以后面的也一起添加了。因此需要用JS动态添加到当前的父级，反正你也要实现显示隐藏效果，刚好可以这样实现
		
			left		
		
			

					
						
															鼠标经过时，显示div														
								...							
						
					
					
						right					
									
				
					
						
															鼠标经过时，显示div														
								...							
						
					
					
						right