如何在div標籤中居中（垂直和水平）按鈕？

Question

我想確定如何在div標籤中居中（垂直和水平）按鈕。

考慮下面的CSS：

div.listBoxMoverUserControl 
{ 
    width: 350px; 
    height: 175px; 
} 

div.listBoxMoverUserControl div 
{ 
    height: 150px; 
} 

div.listBoxMoverUserControl div select 
{ 
    width: 150px; 
    height: 150px; 
} 

div.listBoxMoverUserControl div.listBoxMoverUserControl_column1 
{ 
    float: left; 
    width: 150px; 
} 

div.listBoxMoverUserControl div.listBoxMoverUserControl_column2 
{ 
    float: left; 
    width: 50px; 
} 

div.listBoxMoverUserControl div.listBoxMoverUserControl_column3 
{ 
    float: left; 
    width: 150px; 
} 

我想有這個標記爲中心的按鈕。我如何修改CSS來實現這一目標？

<div class="listBoxMoverUserControl"> 
    <div class="listBoxMoverUserControl_column1"> 
     <label>Test1</label> 
     <asp:ListBox runat="server"></asp:ListBox> 
    </div> 
    <div class="listBoxMoverUserControl_column2"> 
     <input id="btnMoveRight" type="button" value="->" /> <br /> 
     <input id="btnMoveLeft" type="button" value="<-" /> <br /> 
    </div> 
    <div class="listBoxMoverUserControl_column3"> 
     <label>Test2</label> 
     <asp:ListBox runat="server"></asp:ListBox> 
    </div> 
</div> 

Answer 1

文本設置頁邊距周圍的對象佔用的空間休息。如果你想在100px×100px的div中居中放置一個50px×50px的div，那麼你將在50px div周圍設置25px的邊距。

Answer 2

設置項目的DIV中，像這樣：

保證金：0px auto的0px auto的; text-align：center;

<div class="listBoxMoverUserControl_column1" style="margin: 0px auto 0px auto; text-align: center;"> 

**我只是做了一個內聯示例來向你展示我的意思。

Answer 3

Vertical Centering in CSS

可以居中horizintally使用

text-align: center;