html– 为什么按钮元素的高度与具有相同高度属性的兄弟输入元素的高度不匹配？

概述我有以下内容：<div style='border:solid 1px gray; height:22px; line-height:22px; display:inline-block;'>Div</div> <input style='border:solid 1px gray; height:22px; line-

我有以下内容：

正如您在jsFiddle中看到的那样,为什么按钮元素比其余元素短1px？在Chrome和firefox中.最佳答案它与浏览器实现这些元素的盒子模型的方式有关.

div和input都使用content-Box where-as按钮使用border-Box

有关详细信息,请参阅此处：http://www.quirksmode.org/css/box.html

您可以添加Box-sizing：content-Box ;,-moz-Box-sizing：content-Box;,– ms-Box-sizing：content-Box;

到CSS强制它使用计算维度的内容框方法.

编辑 – 更多信息：Why does Firefox use the IE box model for input elements? 总结

以上是内存溢出为你收集整理的html – 为什么按钮元素的高度与具有相同高度属性的兄弟输入元素的高度不匹配？全部内容，希望文章能够帮你解决html – 为什么按钮元素的高度与具有相同高度属性的兄弟输入元素的高度不匹配？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1123467.html