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的更多相关文章
- 【html】【6】div浮动float
我想 当看完上面的必看链接,拥有一定的基础后也得7天左右, 记住 一定要看完,知道它都有什么,没学会不要紧,哪怕只是有个简单的概念也行, 随着后续的使用慢慢深入学习,现在开始div布局. 必看参考: ...
- Popline:帅气的浮动 HTML5 文本编辑器工具栏
Popline 是一个基于 HTML5 实现的富文本编辑器工具栏,设计灵感来自 PopClip ,相比传统的文本编辑器工具,Popline 能够浮动在编辑的文本周围,操作起来十分方便. 您可能感兴趣的 ...
- js div浮动层拖拽效果代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- DIV 浮动存不占空间
DIV 浮动存不占空间比如<div style="width:80px; border:1px solid #333"><div style="floa ...
- div模拟textarea文本域轻松实现高度自适应
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- div模拟textarea文本域轻松实现高度自适应——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...
- Div 浮动到另一个div之上
转自原文Div 浮动到另一个div之上 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <met ...
- 多个div的多文本部分展开显示+关键字自动标注
效果: 源码: <%@ page language="java" contentType="text/html; charset=utf-8" pageE ...
- 如何遍历div里面的文本内容,用each方法,
如何遍历div里面的文本内容,然后进行匹配传来的数据,进行选中div,并进行CSS样式处理, for(i = 0; i< $(".itemMenuRowBox").child ...
随机推荐
- 前端 五——ajax
内容概要: 1.ajax的特点 2.基于JS的ajax 3.基于jQuery的ajax 1.特点: 局部刷新 异步传送(交互) 缺点: (1)无形中向服务器发送的请求次数太多,导致服务器压力增大. ( ...
- Just a test
- ICPC南京补题
由于缺的题目比较多,竟然高达3题,所以再写一篇补题的博客 Lpl and Energy-saving Lamps During tea-drinking, princess, amongst othe ...
- acm之图论基础
1.图的定义 图 是一个顶点集合V和一个顶点间关系的集合E组成,记G=(V,E) V:顶点的有限非空集合. E:顶点间关系的有限集合(边集). 存在一个结点v,可能含有多个前驱节点和后继结点. 1顶点 ...
- PDO PDO_MYSQL MYSQLI MYSQL 的区别
MYSQL,MYSQLI 这两个扩展本身就是访问MYSQL数据库的驱动 PDO则是一个抽象层接口 向程序员提供可调用的API是由,MYSQL驱动.MYSQLI驱动,以及PDO来提供. PDO_MYSQ ...
- hdu 2665 划分树模板题(可作为模板)
Kth number Time Limit: 15000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- POJ 2051 Argus
Argus Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 8782 Accepted: 3985 Description ...
- 【Luogu】P3224永无乡(splay)
题目链接 splay模板,启发式合并(其实就是暴力插入)即可. 顺便吐槽时限,带垃圾回收而已……不至于最后一个点死活不让过吧? #include<cstdio> #include<c ...
- gcd-模板+最小公倍数
#include<iostream> #include<cstdio> #include<algorithm> using namespace std; int G ...
- [POJ1155]TELE
[POJ1155]TELE 试题描述 A TV-network plans to broadcast an important football match. Their network of tra ...