避开ie6使用float后再使用margin兼容的2种方法

  在网页设计中,我们有时会不经意的给自己制造出浏览器的兼容问题。造成每一款浏览器的内容排布错乱或者说并不是我们想要的结果。当然其中问题最多的还是IE6。

  方法一:

  使用一个空白DIV来充当目标div之间的margin值,margin的确给我们带来了很多方便,但是随之也有许多问题,不仅有IE6的双倍margin兼容问题,还有其他都有的子元素绑架父元素问题。这时,我们可以采用新建一个内容为空格符 的div,来达到margin的效果。只需要设置这个div的宽度或高度即可。float-left的时候。将新建的div设置宽度一起浮动即可。margin-top也可以用此方法。不过我更倾向于设置div的padding-top值。

  方法二:

  我们还可以使用定位来解决float后再margin引出的兼容性问题。不过此方法就需要我们对定位有较为深刻的理解才使用。首先定位可分为相对定位和绝对定位,想要绝对定位准确,最好给他的父元素添加定位。如果不容易改变父元素的状态或者父元素使用了margin:auto水平居中,那么就给父元素添加一个相对定位(不用写top和left值)。我们就能随心而欲的把目标div放在任意位置了。

原文地址:https://www.cnblogs.com/guzhixiang/p/4679023.html