如何在<input type ="button">中添加填充？

Question

自从我做了一些严肃的HTML/CSS编码以来已经有几个月了,所以我可能错过了很多东西,但今天我偶然发现了一件非常奇怪的事情.

当我尝试申请padding时<input type="submit">,它不再起作用了.我大约99%确定我能够做到这一点,但现在好像不可能.

我甚至看过我的一个旧项目,我知道我在提交按钮上有填充,但它们不再起作用了.

这是一个问题的小演示

<input type="submit" value="Submit" style="padding: 5px 10px;">
<button type="submit" value="Submit" style="padding: 5px 10px;">Submit</button>

以及它在Mac上的Google Chrome 15中的外观

在此输入图像描述

但它似乎根本不适用于Firefox 4

在此输入图像描述

我敢打赌,这个工作大约在6个月之前,但一定有些变化.我一直在使用Windows Vista和OS X Snow Leopard,最近升级到Lion,但这似乎不是这样.

我错过了什么吗？

编辑:修复拼写错误没有帮助.填充仍然不会应用于第一个按钮.

edit2:经过Adobe Browserlab后,看起来这是OS X特有的问题.我仍然想知道如何在OS X上做到这一点.

Answer 1

在OS X Firefox上,这个问题对我来说也很明显.解决方案是在应用自己的浏览器之前禁用浏览器的默认外观:

input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

Answer 2

<input type="submit" value="Submit" style="padding: 5x 10px;">

你在5px中忘记了p.这打破了造型.