DIV浮动IE文本产生3象素的bug

描写叙述：DIV浮动IE文本产生3象素的bug 左边对象浮动。右边採用外补丁的左边距来定位，右边对象(div)会离左边有3px的间距

复现：在开发者工具里把文本模式设置了杂项后会出现3像素的bug

測试的浏览器：IE7、IE8

浏览器的标准模式与怪异模式两种械，怎样区分这两种模式？

加上<!DOCTYPE html>是标准模式，反则去掉是怪异模式(杂项模式)。

调用下面JS代码来推断属于那种模式：

console.log(window.top.document.compatMode) ;

//BackCompat  表示怪异模式

//CSS1Compat  表示标准模式

CSS:

  #box {

    width: 600px;

    height:100px;

    margin:100px auto;

    background:blue;

  }

  #left {

    float: left;

    width: 50%;

    height:100px;

    background:red;

  }

  #right {

    width: 100%;

    height:100px;

    background:yellow;

  }

  *html #left {

    margin-right:-3px;

    /* 上面这句是重点 */

  }

HTML：

<div id="box">

  <div id="left">1</div>

  <div id="right">|2</div>

</div>

不加margin-left:-3px的效果是：

加margin-left:-3px的效果是：

在CSS样式表中最后一个选择器 *html是什么意思呢？

本人在ie8 ie7浏览器下測试，文本模式选择设置为杂项时。*html请作用

巴特西

DIV浮动IE文本产生3象素的bug

最新文章

热门文章