i图标标签元素与span行内元素内容不对齐的解决方法

Dom结构大致是：

<a>
	<i>图标</i>
	<span>Delete</span>
</a>

如上图，
子节点i图标标签有vertical-align:middle属性。
为使得子节点内容都居中，父节点a标签设置如下属性：

	line-height:2rem;
	text-align:center;

图标与文字“Delete”没有对齐，文字“Delete”居中了，然而icon图标并未居中。在icon字体图标具有vertical-align:middle属性并且不改变的前提下，要使icon与文字对齐，在父节点设置text-align:center的方式貌似不是较好的解决方式。

一种解决方法：

让内容span也设置vertical-align:middle属性，i标签与span标签都设置line-height:2rem和text-align:center属性。