描写叙述：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的更多相关文章
	

    
								
  1. 【html】【6】div浮动float
		
    我想 当看完上面的必看链接,拥有一定的基础后也得7天左右, 记住 一定要看完,知道它都有什么,没学会不要紧,哪怕只是有个简单的概念也行, 随着后续的使用慢慢深入学习,现在开始div布局. 必看参考:  ...
    
		
    2. 
						
  2. Popline：帅气的浮动 HTML5 文本编辑器工具栏
		
    Popline 是一个基于 HTML5 实现的富文本编辑器工具栏,设计灵感来自 PopClip ,相比传统的文本编辑器工具,Popline 能够浮动在编辑的文本周围,操作起来十分方便. 您可能感兴趣的 ...
    
		
    3. 
						
  3. js div浮动层拖拽效果代码
		
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
    
		
    4. 
						
  4. DIV 浮动存不占空间
		
    DIV 浮动存不占空间比如<div style="width:80px; border:1px solid #333"><div style="floa ...
    
		
    5. 
						
  5. div模拟textarea文本域轻松实现高度自适应
		
    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
    
		
    6. 
						
  6. div模拟textarea文本域轻松实现高度自适应——张鑫旭
		
    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...
    
		
    7. 
						
  7. Div 浮动到另一个div之上
		
    转自原文Div 浮动到另一个div之上 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <met ...
    
		
    8. 
						
  8. 多个div的多文本部分展开显示+关键字自动标注
		
    效果: 源码: <%@ page language="java" contentType="text/html; charset=utf-8" pageE ...
    
		
    9. 
						
  9. 如何遍历div里面的文本内容，用each方法，
		
    如何遍历div里面的文本内容,然后进行匹配传来的数据,进行选中div,并进行CSS样式处理, for(i = 0; i< $(".itemMenuRowBox").child ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Java学习笔记2---设置环境变量JAVA_HOME,CLASSPATH,PATH
			
    1.环境变量包括: JAVA_HOME,CLASSPATH,PATH 2.设置环境变量的目的: 路径搜索,方便查找到jdk的安装路径.方便搜索用到的类文件.方便搜索用到的可执行文件如java,java ...
    
			
    2. 
						
  2. Scala学习-02-方法
			
    算数和操作符重载 所有的操作符都是方法. a + b 是一种缩写形式  :  a .+ b “+”是方法名(操作符重载) ++和—— Scala中并没有“++”和“——”.需要使用“+=”和“-=”  ...
    
			
    3. 
						
  3. I love you
			
    while(true) { printf("I love you"); } 字母解析 I-Inject--投入 投入,这个投入有很多概念,有对自己所爱的人,投入自己所有的感情,让你 ...
    
			
    4. 
						
  4. PHP 开启或关闭错误提示
			
    如果不具备修改 php.ini 的权限,可以如下: // 只需在php文件中加入这两句即可开启PHP错误提示 ini_set("display_errors", "On& ...
    
			
    5. 
						
  5. ccna 闫辉单臂路由 和 acl access control list
			
    ccna 闫辉单臂路由 和  acl   access control list 一单臂路由     当前园区网设计很少用到       成本低  小型的.局域网可用         二ACL acc ...
    
			
    6. 
						
  6. Leetcode 450.删除二叉搜索树的节点
			
    删除二叉搜索树的节点 给定一个二叉搜索树的根节点 root 和一个值 key,删除二叉搜索树中的 key 对应的节点,并保证二叉搜索树的性质不变.返回二叉搜索树(有可能被更新)的根节点的引用. 一般来 ...
    
			
    7. 
						
  7. Leetcode 436.寻找右区间
			
    寻找右区间 给定一组区间,对于每一个区间 i,检查是否存在一个区间 j,它的起始点大于或等于区间 i 的终点,这可以称为 j 在 i 的"右侧". 对于任何区间,你需要存储的满足条 ...
    
			
    8. 
						
  8. [python学习篇][python工具使用篇][1] 编辑，设置等
			
    1 添加sublime到环境变量 win +r ,输入sysdm.cpl, 在弹出的界面选择高级,选择环境变量,编辑path,添加sublime的安装目录(这是sublime的一种安装方式,另外一种安 ...
    
			
    9. 
						
  9. java EL详解
			
    转自:http://www.codeceo.com/article/java-el-usage.html 一.EL简介 1.语法结构 ${expression} 2.[]与.运算符 EL 提供.和[] ...
    
			
    10. 
						
  10. HDU-1529 Cashier Employment
			
    据网上说这是到差分约束四星题... 可我觉得难吗? 比推DP方程容易... 两种约束方式,当然实现到程序就变成六种了... #include <cstdio> #include <c ...
    
			
    11.