文本垂直对齐<a>标签内部

Question

示例演示:JSFIDDLE

正如你在我看到的那样JSFIDDLE.文本TELL ME MORE不是垂直对齐中心.

我怎样才能做到这一点？

Answer 1

演示小提琴

添加此CSS

.fa
{
   vertical-align: middle;
}

Answer 2

您应该使用新的CSS3功能，在这种情况下为flexbox

a,button {
  -moz-box-sizing: border-box;
  width: 150px;
  height: 150px;
  display:flex;/*CSS3*/
  align-items:center;/*Vertical align*/
  justify-content:center;/*horizontal align*/
  border: 1px solid #000;
}

<a href="#"><span>Testing 1,2,3</span></a>
    <button><span>Testing 1,2,3</span></button>

就如此容易

随时使用，所有浏览器均支持caniuse.com/#search=flex

另请查看免费和出色的课程flexbox.io/他是这方面最好的老师

还请检查CSS3中的css-grid