Question

我有一张桌子，我想使用垂直对齐，但它不起作用。我可以得到图像大小的数字大小，所以也许这就是我无法使用它的原因。请帮忙。

＆＃13;

td {
  vertical-align: middle;
  text-align: center;
  float: left;
  display: block;
  height: 100%;
}

＆＃13;

<table>
  <tr>
    <td><a href="tel:+56966890434">(56-9) 6689 04 34</a>

    </td>
    <td>
      <a href="https://plus.google.com/111125806825828710565" rel="publisher">
        <img alt="google" src="http://www.claudiacabrera.cl/images/google.png" />
      </a>
      <a href="https://www.facebook.com/pages/Pintura-Claudia-Cabrera">
        <img alt="facebook" src="http://www.claudiacabrera.cl/images/facebook.png" />
      </a>
      <a href="https://www.linkedin.com/profile/view?id=176837064&trk=nav_responsive_tab_profile_pic">
        <img alt="linked in" src="http://www.claudiacabrera.cl/images/linkedin.png" />
    </td>
  </tr>
</table>

＆＃13;

Answer 1

删除它，它会改变布局的执行方式。你希望它像表格单元格那样布局，而不是浮动元素：

float:left;

删除它，它会改变布局的执行方式。您希望它布局像表格单元格，而不是块元素：

display:block;

删除它，表格单元格会自动填充它们的行（除非它们有rowspan）。

height:100%;

Answer 2

你为什么浮动元素？浮动元素不服从vertical-align属性

删除float: left和display: block，您可以将内容垂直对齐。

Working demo

如何将文本放在表格中心？

2 个答案: