Firefox和Opera/Chrome/IE中的表单填充差异
Firefox和Opera/Chrome/IE中的表单填充差异
提问于 2009-08-30 18:02:50
我在我的网站上的表格中的填充物有问题。如果我设置了一个表单元素的高度/宽度，然后给它添加了填充。在我尝试过的所有浏览器中，除了Firefox之外，填充都会添加到高度/宽度上。
如果我有一个宽度为200，高度为20px的输入。宽度和高度分别为210px和30px，但在Firefox中是200px和20px。
我该如何解决这个问题呢？
回答 4
Stack Overflow用户
发布于 2009-08-30 18:42:50
尝试使用CSS框架，比如blueprint-css。看看blueprint附带的示例页面(有一个名为forms.html的文件)。这应该会解决你的填充问题，以及你可能会遇到的一堆其他问题。
Stack Overflow用户
发布于 2009-08-30 18:37:22
您是否尝试过在窗体上放置display:block？听起来FF可能会把它当作一个内联元素来处理。
Stack Overflow用户
发布于 2012-10-16 13:43:43
http://necolas.github.com/normalize.css/
/*
* 1. Addresses box sizing set to content-box in IE 8/9.
* 2. Removes excess padding in IE 8/9.
* 3. Removes excess padding in IE 7.
* Known issue: excess padding remains in IE 6.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
*height: 13px; /* 3 */
*width: 13px; /* 3 */
}
/*
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1354470
复制相关文章
相似问题
腾讯云开发者
