我有以下HTML：
<li>
<a href="#" class=".black">
<p>Search</p><i class="fa fa-search"></i>
</a>
</li>
li元素有背景图片，我想将a - 标记的内容放在图片的底部。我在小提琴中的例子显示了我使用flexbox的尝试，但我对任何支持IE-9的建议持开放态度。
http://jsfiddle.net/pkc5v106/3/
所以.black - 我需要在图像底部垂直对齐，p和i - 标签水平对齐。帮助赞赏。谢谢！