Css Chrome和IE9未将按钮上的文本居中

我使用的是来自谷歌webfont的YUI3重置样式表和PT SAN

我已将我的测试用例缩减为：

<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.5.0pr4/build/cssreset/cssreset-min.css">

<ul>
  <li>
    <input type="submit" value="Create Role" name="submit" id="submit">
 </li>
</ul>

我只测试过IE9、Chrome17和Firefox11。在Firefox中，文本位于按钮的中心，但在Chrome和IE中，文本不在中心

在这里拉小提琴：

和用于比较的图像：

---

由于这个原因，chrome的按钮看起来很不专业。如何解决这个问题？

这在chrome和ie中运行良好，我刚刚移除了填充底部

使用以下方法解决了问题：

//Remove paddings
input, button{
  padding: 0;
}

//Remove for mozilla
input::-moz-focus-inner {
  border:0;
  padding: 0;
}

---

问题是，尽管在firefox中，chrome和IE看起来不错，但文本不再位于中心：(

//Remove paddings
input, button{
  padding: 0;
}

//Remove for mozilla
input::-moz-focus-inner {
  border:0;
  padding: 0;
}