CSS 在按钮上居中文本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7534180/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Center Text on a Button
提问by Lars
I know this has been asked a couple of times before, but not of the solutions seem to be working in this case. Basically, I want the word "play" to be centered vertically and horizontally on this button. Horizontally, the text behaves itself, but vertically, not matter what I try, it is alwaysa little bit lower than it should, in all browsers I test it on. Does anyone have any suggestions? Thanks
我知道这之前曾被问过几次，但在这种情况下似乎没有解决方案有效。基本上，我希望“播放”这个词在这个按钮上垂直和水平居中。水平方向，文本表现自己，但垂直方向，无论我尝试什么，它总是比它应该的低一点，在我测试的所有浏览器中。有没有人有什么建议？谢谢
<style type="text/css">
button {
font-family: Verdana, Geneva, sans-serif;
color: white;
border-style: none;
vertical-align: center;
text-align: center;
}
button:hover {
cursor: pointer;
}
button::-moz-focus-inner /*Remove button padding in FF*/
{
border: 0;
padding: 0;
}
.start {
background-color: #0C0;
font-size: 2em;
padding: 10px;
}
</style>
<button type="button" class="start">play</button>
回答by Doozer Blake
The paddingon .start is likely what you'll have to play around with, although the way it's set, it should be centering it, but you can break it out to something like padding: 8px 10px 10px 10px;
在padding上。开始可能是你有什么玩的，虽然在某种程度上，这一套，应该围绕它，但你可以打破它出来像padding: 8px 10px 10px 10px;
You might also check and set the line-heightunder .start and see if it helps.
您还可以检查并设置line-height.start 下的内容，看看它是否有帮助。
回答by Niet the Dark Absol
The correct value for vertical-alignis middle, not center. However I'm not sure if that'll make the difference, because it might just affect where the button itself is aligned vertically relative to surrounding text. I'm pretty sure button text is vertically centered by default, though...
的正确值vertical-align是middle，不是center。但是，我不确定这是否会有所作为，因为它可能只会影响按钮本身相对于周围文本垂直对齐的位置。我很确定按钮文本默认是垂直居中的，虽然......
