Mik*_*ike 6 html css html-table
我的愿望很简单 - 制作一个可点击的单元格(即带有链接的单元格),其最小高度要求(在这种情况下为40像素)蚂蚁垂直居中的文本.这是我到目前为止所提出的:
<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>
Run Code Online (Sandbox Code Playgroud)
一切都还可以,但我无法将文本垂直对齐(居中):/该vertical-align属性在这种情况下不起作用.
这是行动中的例子(链接).
尝试使用以下 css 将文本居中并垂直对齐:
table.test td {
text-align:center;
vertical-align:middle
}
Run Code Online (Sandbox Code Playgroud)