padding兼容问题

作者席鑫淼来源 ligangxi.com 浏览发布时间 15/07/28

首先我们说说firefox和ie对css的宽度显示有什么不同：

其实css ’width’ 指的是标准css中所指的width的宽度，在firefox中的宽度就是这个宽度。它只包含容器中内容的宽度。而Internet Explorer ’width’则是指整个容器的宽度，包括内容，padding ，border。

Firefox中：容器占的宽度=内容宽度+padding宽度+border宽度

ie中：内容宽度=您定义的容器宽度(Internet Explorer ’width’)-padding宽度-border宽度

所以，如果ie中定义 width:120px;padding:5px 的话，所显示的宽度就是120px.

即padding:5px是在width里面。

而Firefox中，上面这个定义，显示宽度就是 125 px;

所以，我们就必须这样定义

width:115px !important;width:120px;padding:5px;

必须注意的是， !important; 一定要在前面。