问为<input type=‘提交’>添加了高度/宽度的CSS填充

EN

如果有人问了这个问题，我很抱歉，但我找不到完全相同的问题。正如W3schools所说，height属性不包括填充、边框或边距！(link)。下面是一个简单的样式声明：

input {
  width:180px;
  height:18px;
  padding:7px;
  border:1px solid black;
}

下面是html：

<input type='text' name='text' value='194px by 32px' /><br  />
<input type='submit' name='button' id='button' value='180px by 18px' />

文本字段的大小是194px x 32px，但submit按钮的大小是180px x 18px。显然，我可以将按钮的高度和宽度增加两倍，但我想知道为什么会有差异。我在这里做了一个jsfiddle：http://jsfiddle.net/RRf5A/。谢谢你的帮助。仅供参考，我已经尝试了<button>而不是input submit和display:inline-block。