我经常遇到使用line-height的css单行垂直居中问题。我通常将此方法用于按钮。我只是设置高度和行高，没有填充，如：
height: 44px;
line-height: 44px;
但有时它并不完美。看到这个小提琴：
https://jsfiddle.net/Lm444sny/1/
我只是好奇它不起作用的原因。文字有点居中，但并不完美。
答案 0 :(得分：2)
取决于字体本身的行高。 Sone字体有更多的空白步伐，所以似乎没有对齐。
将按钮行高改为47px或不使用内部标签。例如，Chrome将按钮内的文本与显示屏对齐，这是垂直居中的最佳方式。 看一下这个https://philipwalton.github.io/solved-by-flexbox/demos/vertical-centering/
答案 1 :(得分：0)
为什么不使用flex-box？您可以将display：flex应用于按钮，其内容将是一个flex项（在本例中为简单文本）。
答案 2 :(得分：-1)
它取决于vertical-align属性。有时当您使用例如图标字体时，符号可以具有不同的高度。
使用flexboxes可以实现垂直居中的最佳效果：https://css-tricks.com/snippets/css/a-guide-to-flexbox/