无法垂直对齐表格单元格中的链接 [英] Can't vertically align a link in a table cell
本文介绍了无法垂直对齐表格单元格中的链接的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我的愿望很简单 - 使具有最小高度要求（在这种情况下为40像素）的可点击单元格（即具有链接的单元格）蚂蚁垂直居中的文本。这是我到目前为止所做的：
My wish is simple - to make a clickable cell (i.e. cell with a link) with a minimum height requirement (40 px in this case) ant vertically centered text. Here's what I come up with so far:
<html>
<head>
<style>
table.test td {
border:1px solid black;
width: 200px;
height: 100%;}
table.test td.cell a {
background-color: #FFF5EE;
display:inline-block;
height:100%; width:100%;
min-height: 40px;}
table.test td.cell a:hover, td.cell a:active {
background-color: #D2691E;}
</style>
</head>
<body>
<table class="test">
<tr>
<td class="cell"><a href="www.google.lt">Google</a></td>
<td>Line1</td>
</tr>
<tr>
<td class="cell"><a href="www.google.lt">Google</a></td>
<td>Line1<br>Line2<br>Line3</td>
</tr>
</table>
</table>
</body>
</html>
一切正常，但我不能垂直对齐c $ c> vertical-align 属性在此情况下不起作用。
Everything's ok, but I can't get the text aligned (centered) vertically :/ The vertical-align property doesn't work in this case.
下面是操作示例（ link ）。
推荐答案
删除该行
height: 100%;
来自
table.test td.cell a { ... }
并添加
vertical-align: middle;
到
table.test td { ... }
这篇关于无法垂直对齐表格单元格中的链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
