0

我在父 div 中有两个 div 标签。我想在同一行显示两个 div 并居中。下面是html代码。

<div id="parent">
    <div id="addEditBtn" style="display:inline-block; vertical-align: middle; width:20px; cursor:pointer;" class="ui-state-default ui-corner-all"> <span class="ui-icon ui-icon-pencil"></span></div>

    <div id="deleteBtn" style="display:inline-block; vertical-align: middle; width:20px; cursor:pointer;" class="ui-state-default ui-corner-all"> <span class="ui-icon ui-icon-trash"></span></div>
</div>

我试过“显示：内联块；垂直对齐：中间；” 但它的左对齐。请帮助我在父 div 中居中 div 标签。

4

3 回答 3

1

请添加css

    #addEditBtn,#deleteBtn {
    display:table;
margin:0 auto;
width:48%;
    }
于 2014-04-23T11:26:04.437 回答
0

当你display: inline-block;和元素时，为了居中的目的，它被视为图像或文本字符。

#parent {
    text-align: center;
}

观看现场演示。

于 2012-09-05T09:37:18.807 回答
0

您将需要另一个级别的嵌套 div。

第一级是inline-blockand width:50%，第二级display:block是width:20pxand margin:0 auto；

编辑 ：

是的，text-align: center在父 div 上也应该工作：http: //jsfiddle.net/ZGeN8/，但我更喜欢我的答案，因为它会更容易适应 IE6/7

于 2012-09-05T09:37:27.507 回答