如何将文本居中放置在表格中？

Question

我有一个表，我想使用垂直对齐，但它不工作。我可以得到数字的大小来加大图像的大小，所以也许这就是我不能使用它的原因。请帮忙。

http://jsfiddle.net/d7onugrw/1/

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

<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>

Answer 1

删除此，它的变化是进行布局的方式。你想要它像一个表单元格，而不是浮动元素：

float:left; 

删除它，它会改变布局的执行方式。你想让它奠定了像一个表格单元格，不是块元素：

display:block; 

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

height:100%; 

Answer 2

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

删除float: left和display: block并且您获得垂直对齐的内容。

Working demo