javascript - 为什么按钮、输入与 div 的宽度结果不同？

Question

这是js bin http://jsbin.com/ojiJEKa/1/edit

对不起我的愚蠢问题，但是，为什么<div>& 与 &有<a>不同的宽度结果？即使他们有相同的风格<input><button>

如何让他们平等？

Answer 1

默认情况下，按钮和输入元素box-sizing设置为border-box。这意味着填充和边框在定义的宽度内。

这不是 a 和 div 元素的基础，它们是否具有正常的 box-sizing 属性。这意味着在宽度之上额外添加了填充和边框。

为了使它们都一样，规范化box-sizingcss 属性。

Answer 2

input 和 button 有不同的 box 模型，你可以给它们添加 "box-sizing:content-box" 来重置 box 模型。