css – 如何在div标签中心(垂直和水平)按钮?

前端之家收集整理的这篇文章主要介绍了css – 如何在div标签中心(垂直和水平)按钮?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试确定如何在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>

解决方法

设置对象周围的边距以占用其余的空间。如果要将一个50像素×50像素的div设置为100像素×100像素的div,那么您将在50像素的div周围设置一个25像素的边距。

猜你在找的CSS相关文章