如何垂直對齊td標籤中的元素

Question

我想在我的<td>標籤中垂直對齊中心/中間的3個元素。這些是我要對齊的元素：

1. 圖像按鈕（標籤）頂部箭頭圖像
2. jquery的滑塊
3. 圖像按鈕（標籤）底部箭頭圖像

本質上元素用於垂直滾動圖表。他們有點錯位。我希望他們都處於中心位置。

我當前的代碼是：

<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標籤應該呆在那裏。

Answer 1

感謝大家的幫助。我自己找到了答案。這是新的代碼。只有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> 

Answer 2

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

我不知道我完全理解，但也許這樣？

Answer 3

閱讀有關垂直對齊here

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

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