关于css兼容性问题及一些常见问题汇总

2024-07-11 08:33:02

字体：大中小

来源：转载

供稿：网友

目前主流浏览器的兼容性做的都比较好了，本文主要针对IE6，7的不兼容问题进行解决。

1.有浮动存在时，计算一定要精确，不要让内容的宽高超出我们所设置的宽高，IE6下，内容会撑开设置好的高度。

解决方法：给对应的父级加overflow:hidden;但是会有部分被隐藏掉，最好是精确计算宽高再设定

eg：（ie会撑开）

XML/HTML Code复制内容到剪贴板

<style> box{ width:400px;}
left{ width:200px;height:300px;background:red;float:left;} right{ width:200px;float:right;}
div{width:180px;height:180px;background:blue;padding:15px;} *
计算一定要精确不要让内容的宽高超出我们设置的宽高在IE6下，内容会撑开设置好的宽高
/ </style>
</head> <body>
<div class="box"> <div class="left"></div>
<div class="right"> <div class="div"></div>
</div> </div>
</body>

2. 在IE6下有元素浮动时，如果宽度需要由内容撑开，就给里边的块元素都加浮动，正常浏览器不用加浮动。

eg：

XML/HTML Code复制内容到剪贴板