div+css使用!important标记实现Firefox和IE6处理padding尺寸上的兼容
2010-02-24 20:45
766 查看
<html>
<body>
<div style="border: 1px solid red; width: 300px; padding: 10px;">
在Firefox中，div的完整宽度是padding+width，因此width: 300px; padding: 10px;的实际宽度是320px;而在IE6中，div的完整宽度是width，所以这个div和下面的div宽度一致。
</div>
<div style="border: 1px solid red; width: 300px;">
宽度为300px的div
</div>
<div style="border: 1px solid red; width: 280px !important; width: 300px; padding: 10px;">
通过借助!important标记，可以设置Firefox中的width值为IE6中的width值减去padding值，这样就实现了Firefox与IE6的padding效果尺寸兼容。
</div>
</body>
</html>
<body>
<div style="border: 1px solid red; width: 300px; padding: 10px;">
在Firefox中，div的完整宽度是padding+width，因此width: 300px; padding: 10px;的实际宽度是320px;而在IE6中，div的完整宽度是width，所以这个div和下面的div宽度一致。
</div>
<div style="border: 1px solid red; width: 300px;">
宽度为300px的div
</div>
<div style="border: 1px solid red; width: 280px !important; width: 300px; padding: 10px;">
通过借助!important标记，可以设置Firefox中的width值为IE6中的width值减去padding值，这样就实现了Firefox与IE6的padding效果尺寸兼容。
</div>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- div+css使用padding样式和!important标记实现Firefox和IE6处理带float样式的margin尺寸上的兼容
- div+css使用!important标记实现Firefox和IE6处理padding尺寸上的兼容
- css div实现的遮罩层完美兼容IE6-IE9 FireFox
- 使用IE条件注释 实现兼容 IE, Opera, Firefox 的 DIV+CSS 表格布局 By shawl.qiu
- div+css实现Firefox与IE6兼容的手形鼠标指针
- div+css实现Firefox和IE6兼容的垂直居中
- div+css实现Firefox和IE6兼容的垂直居中
- div+css - Firefox和IE浏览器兼容问题 - padding-right在IE6下导致抖动
- CSS实现图片超过限定尺寸自动缩放兼容IE和Firefox
- css不兼容情况 background-position在firefox下不兼容，出现图片位置不对，的处理情况；ie6、ie7强制选择器。
- css不兼容情况 background-position在firefox下不兼容，出现图片位置不对，的处理情况；ie6、ie7强制选择器。
- div+css 兼容ie6 ie7 ie8 ie9和FireFox Chrome等浏览器方法
- div+css兼容 ie6_ie7_ie8_ie9_ie10和FireFox_Chrome等浏览器方法
- (十年积累)div+css 完全兼容ie6 ie7 IE8 IE9 和firefox方法
- css div 遮罩层 兼容IE6-IE9 FireFox
- 使用css制作三角，兼容IE6，用到的标签<div><s><span>
- CSS实现的div悬浮框并且兼容IE6的样式
- padding+div 在ie7、ie6以及firefox中的兼容问题
- div+css+js实现无缝滚动类似marquee无缝滚动兼容firefox
- DIV+CSS兼容IE6、IE7、Firefox方法探究