论坛首页 Web前端技术论坛

怪异模式下 absolute 在IE6,7下的bug

浏览 3878 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-07-13   最后修改:2009-07-22
CSS
<!---->
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	<style>
		*{
			margin:0px;
			padding:0px;
		}
		#d30{
			height:100px;
		}
		#d01{
			background:red;
			width:500px;
			height:500px;
			overflow:hidden;
			position:static;
		}
		#d01 #d02{
			background:yellow;
			width:200px;
			height:200px;
			position:absolute;
			top:100px;
		}
	</style>
</head>
<body>
	<div id="d30"></div>
	<div id="d01">
		<div id="d02"></div>
	</div>
</body>
</html>



可以看到d02的位置相对于父元素d01,而不是body,去掉d01的overflow:hidden;后正常,或者加dtd,在标准模式下也正常


网名: 天堂左我往右
   发表时间:2009-07-14  
http://www.w3.org/TR/CSS2/visuren.html#absolute-positioning

In the absolute positioning model, a box is explicitly offset with respect to its containing block. It is removed from the normal flow entirely (it has no impact on later siblings).

意思是说,绝对定位的元素其偏移量是相对于其父元素的。所以不是body
0 请登录后投票
   发表时间:2009-07-14  
jncz 写道
http://www.w3.org/TR/CSS2/visuren.html#absolute-positioning

In the absolute positioning model, a box is explicitly offset with respect to its containing block. It is removed from the normal flow entirely (it has no impact on later siblings).

意思是说,绝对定位的元素其偏移量是相对于其父元素的。所以不是body




绝对定位的元素其偏移量是相对于  absolute或者relative元素的,如果父元素是static,则继续寻找父父的元素是否是absolute或者relative的,直到body为止

示例里面父元素是static的,所以应该是相对于body定位的...
0 请登录后投票
   发表时间:2009-07-14  
学习了,还是尽量加doctype吧,标准模式下css正常发挥作用。
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics