父元素padding后,子元素absolute定位偏差

假设一DIV已经设置 position:relative及padding:30px,然后要在里面放置一个position:absolute的元素,并设置它left:0;top:0——这种效果可用来实现类似微博消息那种左头像右内容的布局。

在Firefox等标准浏览器下,绝对定位的元素此时真的是左0上0,顶着父DIV的边,但IE下却是左30上30,只因为父DIV设置了padding为30…
这个问题很要命,以前我有一个无奈的解决办法,就是用_,*,\9等特殊字符为IE进行hack。但其实有一个非常简单的解决办法——只要为父DIV加上zoom:1,触发其hasLayout,即可在IE下实现和标准浏览器下一样的样式了。
此解决方案适合绝大部分情况。
——————————————–
每发现IE一个无厘头BUG,都会让我对IE的恨加深一层。兼容问题,其中辛苦,只有身在其中的同行们才能体会啊

1 评论

发表评论

电子邮件地址不会被公开。