CSS IE的bug

没事总结一下IE的各种bug一下内容有一部分各位大神那里摘抄的，请恕小女子无罪：

1.ie6IE 6对margin的 auto 并没有正确的设置

解决方案：最简单的方法是在父元素中使用 text-align: center 属性，而在元件中使用 text-align: left 。

2.magrin的两倍补白

解决方案: 设置 display: inline 属性可以解决问题。

3.无法设置微型高度 : IE不允许元件的高度小于字体的高度，所以，下面的fix是设置上字体大小。

解决方案1:（如设置字体大小为font-size:0;）

解决方案2：overflow: hidden

4.当父元件中使用了 overflow 的 auto 属性，并且在其里放入相关元件。你会看来里面的元件会跨出来

解决方案:设置 position: relative;属性

5.IE忽略了min-height

6.在list项目的空行

解决方案1：li下面的a设置高度

解决方案二:给li下面的a设置浮动，然后再清楚浮动

解决方案三:为 li 加上display: inline

时间： 2024-10-16 14:49:15

CSS IE的bug的相关文章

css 优先级的bug

对于前端而言,了解css样式的优先级,对开发或处理bug有着事半功倍的效果,今天在做项目的时候,突然碰到一个优先级的小问题,刚开始不知道所因,后来才发现这个问题是由优先级造成的.先描述下问题,鼠标悬停在父容器时,子容器显示,移开消失.看到这个问题,可能有些人要喷了,这和优先级有毛线关系,看起来的确没关系,其实还是存在一定关系的.假如你在书写子容器样式时,采用的是内联式写法,那么这个悬停是否还有作用呢?看下面的代码-- 示例代码 <!DOCTYPE html> <html> <

IE8、7、6动态添加样式时，CSS hack的BUG

问题描述下面这段CSS代码通过JS动态添加,结果会怎样呢? .box { background: red; /* normal browsers */ *background: blue; /* IE 6 and 7 */ _background: green; /* IE6 */ } 通过以下代码添加到页面中 var node = document.createElement('style'); node.type = 'text/css'; if (node.styleSheet) { /

css属性应用bug大杂烩(后续继续更新)

一.Flex布局使用时的坑: 1.常见的左右分布的flex布局中,左侧给定宽度,右侧占满剩余空间,但当右侧中文字内容很多时,会挤占左侧空间,时左侧不能按照定宽显示. <style> .father{ display: flex; width: 500px; height: 200px; } .left{ width: 200px; background-color: green; } .right{ flex-grow: 1; background-color: red; } </sty

Ueditor uParse功能Bug，生成了全局CSS: li，影响全局样式, 造成网页其它部分显示混乱解决方案

Ueditor uParse功能关于CSS li的Bug,解决方法百度UEditor是一款不错的在线富文本编辑插件,这里不做过多介绍,详情移步UEditor官网:http://ueditor.baidu.com/ Bug: Ueditor uParse功能,生成了全局CSS: li,影响全局样式, 造成网页其它部分显示混乱. 版本:UEditor 1.4.3 分析如下: Ueditor uParse功能Bug,生成了全局CSS:li,影响全局样式,造成网页其它部分显示混乱,如下图示: 解决方法

【引用】CSS浏览器兼容手册

CSS技巧 1.div的垂直居中问题vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 2. margin加倍的问题设置为float的div在ie下设置的margin会加倍.这是一个ie6都存在的bug.解决方案是在这个div里面加上display:inline; 例如: <#div id=”imfloat”> 相应的css为 #IamFloat{

css样式兼容不同浏览器问题解决办法

在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网站,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所有浏览器通用 height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7.FF 共用 height: 100px !important; 一.CSS HACK 1, !important

CSS兼容性常见问题总结

DIV+CSS设计IE6.IE7.FF 兼容性 DIV+CSS网页布局这是一种趋势,我也开始顺应这股趋势了,不过在使用DIV+CSS网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV+CSS设计的网页,就应该更注意IE6 IE7 FF对CSS样式的兼容. 什么是浏览器兼容:当我们使用不同的浏览器(Firefox IE7 IE6)访问同一个网站,或者页面的时候,会出现一些不兼容的问题,在这种浏览器下显示正常,在另一种下就乱了,我们在编写CSS的时候会很恼火,刚修复了这个浏

【转载】各浏览器CSS兼容问题

CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名. CSS技巧 1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容

浏览器兼容性汇总(CSS+js)

目录 ? JavaScript 3 1. HTML对象获取问题 3 2. const问题 3 3. event.x与event.y问题 3 4. window.location.href问题 3 5. frame问题 3 6. 模态和非模态窗口问题 3 7. firefox与IE的父元素(parentElement)的区别 3 8. document.formName.item("itemName") 问题 3 9. 集合类对象问题 3 10. 自定义属性问题 3 11. input.