Css 不使用div垂直对齐文本

我花了很长时间试图弄明白这一点，它似乎非常接近于工作，但它只是无法垂直对齐。我已经尝试了大多数解决方案，同时返回到相同的表格单元格答案。但在这里不起作用，文本在顶部对齐。有人知道为什么这不起作用，以及它的修复方法吗

jsfiddle:

<a href="#">Open Up</a>​

HTML:

<a href="#">Open Up</a>​

它的外观（左：正常|右：悬停）：

<a href="#">Open Up</a>​

---

另外，我不能有任何div，因为我希望整个圆圈都可以点击作为链接。谢谢

设置元素的

行高

等于

高度

，即：

行高：240px

编辑：对于多行支持，在锚定标记内放置一个
span
，使用
显示表格单元格设置样式；身高：100%；垂直对齐：中间对齐，并使用
显示：表格设置包含锚定标记的样式，如图所示。
位置：绝对
与
显示：表格单元格
不混合。在
：hover
规则中删除该选项和
显示：block
，它就会工作
 试试看这篇文章。我认为如果你愿意稍微修改一下你的代码，这会很有帮助。如果没有它，我认为这是不可能的，除非您使用像jquery这样的其他东西。
希望有帮助

编辑：只是为了帮助你多一点：将{position:absolute；}更改为{display:table cell；}并删除行a:hover{display:block}
是的，但是当句子很长时，它不会自动换行。想法？呃，我以为这就是答案，但我需要它显示在图片的顶部。这就是为什么我要使用绝对位置，除非你能想出其他方法，把它从流程中去掉。把整个东西包装在一个div中，绝对地定位那个包装器。除了Aaron在上游提到的
行高
技术之外，不要认为还有其他解决方案。在这种情况下（将位置设置为表格单元格），行高实际上是不必要的。并且，正如您所说，移除显示：块；解决了这个问题，它可以处理多行，并且文本位于灰色背景和/或img之上。@steveax太棒了。但为了我的目的，我不能有一个在中间的跨度。我可以有一个包在外面的。这有帮助吗？@EGHDK这正是我的建议：将
元素包装在一个div中，并定位包装div，而不是
元素。如果您也有一张希望它看起来像什么的图片，这个问题可能会更清楚。是的，一些人已经找到了这个答案，但它需要绝对定位。