如何垂直对齐td标签中的元素

问题描述：

我想在我的<td>标签中垂直对齐中心/中间的3个元素。这些是我要对齐的元素：如何垂直对齐td标签中的元素

图像按钮（标签）顶部箭头图像
jquery的滑块
图像按钮（标签）底部箭头图像

本质上元素用于垂直滚动图表。他们有点错位。我希望他们都处于中心位置。

我当前的代码是：

<td style="vertical-align:top;">     
    <div id="div1" style="display:inline-block; horizontal-align:center; margin-top:5px;"> 
    <a id="a_top" title="Top" class="ui-icon ui-icon-circle-triangle-n" style="border:0px;"></a> 
    </div> 
    <div id="slider_y" style="height:240px; width:6px; horizontal-align:center; margin-top:10px; "></div> 
    <div id="div2" style="display:inline-block;horizontal-align:center;margin-top:10px;"> 
    <a id="a_bottom" title="Bottom" class="ui-icon ui-icon-circle-triangle-s" style="border:0px;"></a> 
    </div> 
</td>

我打开删除相关图像按钮div标签，但td标签应该呆在那里。

没有'水平align' CSS属性。 – alex 2011-05-31 04:34:53

CSS的两个对齐属性是'文本对齐'（水平）和'垂直对齐'（垂直） – wired00 2011-05-31 04:43:16

将是有用的，如果你可以张贴你想要的图片 – JohnP 2011-05-31 05:03:11

答

感谢大家的帮助。我自己找到了答案。这是新的代码。只有td标签已更改为添加其他属性align = center。这将对齐td标签中的所有元素。在表格单元格

<td align="center" style="vertical-align:top;">    
    <div id="div1" style="display:inline-block; horizontal-align:center; margin-top:5px;"> 
    <a id="a_top" title="Top" class="ui-icon ui-icon-circle-triangle-n" style="border:0px;"></a> 
    </div> 
    <div id="slider_y" style="height:240px; width:6px; horizontal-align:center; margin-top:10px; "></div> 
    <div id="div2" style="display:inline-block;horizontal-align:center;margin-top:10px;"> 
    <a id="a_bottom" title="Bottom" class="ui-icon ui-icon-circle-triangle-s" style="border:0px;"></a> 
    </div> 
</td>

答

<td style="vertical-align:top;">     
    <div id="div1" style="display:inline-block; horizontal-align:center; margin-top:5px;"> 
    <div align="center"><a id="a_top" title="Top" class="ui-icon ui-icon-circle-triangle-n" style="border:0px;"></a> 
     </div> 
    </div> 
    <div id="slider_y" style="height:240px; width:6px; horizontal-align:center; margin-top:10px; "></div> 
    <div id="div2" style="display:inline-block;horizontal-align:center;margin-top:10px;"> 
    <div align="center"><a id="a_bottom" title="Bottom" class="ui-icon ui-icon-circle-triangle-s" style="border:0px;"></a> 
     </div> 
    </div> 
</td>

我不知道我完全理解，但也许这样？

答

阅读有关垂直对齐here

vertical-align:middle 
vertical-align:top 
vertical-align:bottom

http://phrogz.net/css/vertical-align/

如何垂直对齐td标签中的元素

相关推荐