IE下的bug解决方案
1、IE6下的双边距bug
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>双边距bug</title>
<style>
* { margin: 0; padding: 0; }
.box{
width: 500px;
height: 300px;
background: red;
float: left; /* 在块级标签中添加浮动float之后,又添加margin,会导致IE6下的双边距bug */
margin-left: 50px;
/* 解决方案: 为IE6添加样式,将块级元素变为行内元素 */
_display: inline;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
2、IE6下的1px偏差
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>IE6的1px偏差</title>
<style>
/* position:absolute;解决方案:为IE6下的定位元素的父级宽高都设定为偶数,就可以避免 */
.box1 { width: 400px; height: 400px; border: 1px solid black; position: relative; }
.box2 { width: 50px; height: 50px; position: absolute; right: -1px; bottom: -1px; background: yellow; }
</style>
</head>
<body>
<div class="box1">
<div class="box2"></div>
</div>
</body>
</html>
3、IE6下overflo: hidden;不起作用。
解决方案:这时候给父级也添加position:relative;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>在IE6-overflow-hidden</title>
<style>
.box1 { width: 500px; height: 300px; background: red; overflow: hidden; position: relative; }
.box2 { width: 300px; height: 500px; background: yellow; position: relative; }
</style>
</head>
<body>
<div class="box1">
<div class="box2"></div>
</div>
</body>
</html>
4、如何分别单独定义IE6 7 8 的样式
_width: 900px; /* IE6专用 */ *+width: 900ox; /* IE7专用 */ *width: 900px; /* IE7 6 都起作用 */ width: 900px\9; /* IE6 7 8 9 10 */ width: 900px\0; /* IE8 9 10 */ width: 900px\9\0; /* IE9 10 */
IE下的bug解决方案的更多相关文章
- 【腾讯Bugly干货分享】手游热更新方案xLua开源:Unity3D下Lua编程解决方案
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2bY7A6ihK9IMcA0bOFyB-Q 导语 xL ...
- input 光标在 chrome下不兼容 解决方案
input 光标在 chrome下不兼容 解决方案 height: 52px; line-height: normal; line-height:52px\9 .list li input[type= ...
- 为什么我没有拔出钥匙 ——开锁引发的程序bug解决方案的思考
http://blog.csdn.net/wojiushiwo987/article/details/8851204为什么我没有拔出钥匙 ——开 ...
- IE6/7 下:inline-block解决方案
6/IE7下:inline-block解决方案 IE6/IE7下对display:inline-block的支持性不好. 1.inline元素的display属性设置为inline-block时, ...
- jqueryeasyUI dialog 弹出窗口超出浏览器,导致不能关闭的bug解决方案
jqueryeasyUI dialog 弹出窗口超出浏览器,导致不能关闭的bug解决方案 2014年8月30日 3233次浏览 相信很多前端朋友都用过jqueryeasyUI,jqueryeasyUI ...
- Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案
Ext1.X的CheckboxSelectionModel默认全选之后不允许编辑的BUG解决方案,ext 的CheckboxSelectionModel在后台默认选中之后,前台就不允许编辑的bug是存 ...
- alibaba druid 在springboot start autoconfig 下的bug
alibaba druid 在springboot start autoconfig下的bug 标签(空格分隔):druid springboot start autoconfig 背景 发现.分析过 ...
- react native 0.56.0版本在windows下有bug不能正常运行
react native的0.56.0版本在windows下有bug不能正常运行请init 0.55.4的版本 react-native init MyApp --version 0.55.4 注意v ...
- ie下的bug之button
场景描述: 现在页面设计是都喜欢自定义按钮样式,某日接收到页面发现在ie下有bug,上代码: <div> <button><span><a href=&quo ...
随机推荐
- SQL用法总结
1.创建数据库语句 create table persons( 'id' INT NOT NULL AUTO_INCREMENT, ) NOT NULL, ) NOT NULL, PRIMARY KE ...
- 新浪云(SAE)使用没有内置的django版本
SAE自带的django目前到1.5版本,如果要使用更高的版本,则需要把django包同代码一起上传. 以1.7.3为例 先从SAE svn签出代码,默认1是根目录 1. 1目录下创建文件夹 sit ...
- QT的三种协议说明
关于Qt的三种协议以及是否收费,有以下引文: 引文一: 最近一直在学习 Qt.Qt 有两个许可证:LGPL 和商业协议.这两个协议在现在的 Qt 版本中的代码是完全一致的(潜在含义是,Qt 的早期版本 ...
- 实例源码--Android自定义Gallery动画效果
相关文档与源码: 下载源码 技术要点: 1.自定义控件的使用 2.Gallery控件的使用实例 3.详细的源码注释 ...... 详细介绍: 1.自定义控件的使用 本套源码通过自定义控件的方式,继 ...
- 结合源码看nginx-1.4.0之nginx事件驱动机制详解
目录 0. 摘要 1. nginx事件模块组织结构 2. nginx事件模块数据结构及类图 3. nginx事件模块运行机制 4. 练习:一个简单的事件驱动模块 5. 小结 6. 参考源码
- CSS skills: 1) Navigate item's animation
<style> .nav { border-right:1px solid #268eb7; } .nav li{overflow:hidden;height:55px;border-le ...
- linux 安装GCC
研究生阶段已经开始了一段时间了,选了LINUX深入分析,之前没怎么接触过,感觉还是有点难度的.不,好像是很难. 从学校借了一台电脑,安装了UBUNTU12.04的系统,可是不知道怎么地,这个系统里,没 ...
- Objective-C ,ios,iphone开发基础:多个视图(view)之间的切换2,使用导航栏控制,以及视图之间传值。
首先需要说明的是每个应用程序都是一个window,背景色为黑色.在window上可以跑多个view进行来回切换,下面就通过手动写代码来体现导航栏切换view的原理. 第一步,新建一个single vi ...
- PPI_network&calc_ppi
# -*- coding: utf-8 -*- # __author__ = 'JieYao' from biocluster.agent import Agent from biocluster.t ...
- 使用CSS实现一个简单的幻灯片效果
方法一: 简单的CSS代码实现幻灯片效果 方法二: 使用CSS3 Animation来制作幻灯片 方法一: 简单的CSS代码实现幻灯片效果 话不多说,直接上代码 <!DOCTYPE html&g ...