简单的CSS:文本不会在按钮中居中

Question

在Firefox'A'显示在中间,在Chrome/IE上它没有:

<button type="button" style="width:24px; text-align:center; vertical-align:middle">A</button>

请注意以下结果相同:

<button type="button" style="width:24px;">A</button>

编辑:现在似乎已在Chrome 5.0中修复

Answer 1

在Chrome中进行测试,您需要添加

padding: 0px;

到CSS.

Answer 2

padding: 0px解决水平居中问题

，而

设置line-height等于或小于按钮的高度则解决垂直对齐问题。

line-height: 0px;