在我的网站上，我必须为几种类型定义“ vertical-align：baseline”。
那种样式在IE中工作得很好，但是在Chrome中有一个问题，在最简单的示例中我无法复制。下面的代码完全可以正常工作，但是我的网站呈现的相同代码的“姓氏”，“ LLLLLLL”单元格的内容与“大单元格”的基准线对齐，但与自己的基准线不对齐细胞。实际上，它与所有“跨接”行的基准线对齐...
<html>
<head><title>Test table vertical alignment</title><body>
<style type="text/css">
table.t_data
{
border-collapse:collapse;
margin: 0 auto 0 auto;
}
table.t_data tbody th, table.t_data tbody td
{
border: #333 1px solid;
vertical-align: baseline;
}
</style>
<table class="t_data">
<tbody>
<tr>
<th>Last Name</th>
<td>LLLLLLLL</td>
<td rowspan="3">Big cell</td>
</tr>
<tr>
<th>First Name</th>
<td>FFFFFF</td>
</tr>
<tr>
<th>Team</th>
<td>My Cool Team</td>
</tr>
</tbody>
</table>
</body>
</html>
我以为这是一个“流行的”（众所周知的）错误，但是找不到关于相同问题的任何信息。
看起来我的代码中还有其他一些东西会影响垂直对齐，但是我无法弄清楚哪里出了问题。我试图禁用该不同的样式选项，但没有发现任何影响垂直对齐的样式。
问题1：这种对齐方式和按行跨度分组的表单元格是否存在已知问题？
问题2：如果没有通用解决方案，请检查页面上的代码：http://vfm-elita.com/player/4990。您将看到第一行的单元格为空，其内容移至底部以与更大的单元格基线对齐...
我将欢迎任何帮助或想法。提前非常感谢您！
附言我发现了类似的问题（http://stackoverflow.com/questions/10272553/vertical-align-baseline-doesnt-work-in-chrome），但建议的解决方案对我的情况没有帮助。
P.P.S.我接受我的问题可能会通过引用外部站点而引起负面反馈，但是我为这个问题苦苦挣扎了几天，并且会为此感到痛苦。解决问题后，还要保证删除链接。
编辑：P.P.P.S。
具有“ vertical-align：baseline”的想法是由于在同一行同时具有“纯文本”和“”元素（如按钮或输入文本字段）的情况下，必须垂直对齐表行的内容。
但是，最近我发现“垂直对齐”样式无法对齐元素内容。它使元素本身对齐，因此在我的情况下，我应该将其应用于单元格内容，而不是对单元格（td，th）应用“ vertical-align：baseline”。但这还不能解决问题...
最佳答案
在您的CSS中改用“ line-height”。尝试将按钮中的文本垂直排列在按钮中间时，我遇到了同样的问题。行高可以让您根据需要将其微调多少，以使其定位在所需的位置...希望这会有所帮助:)
关于html - vertical-align:基线受Chrome中行距的影响，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13655772/