Question

我有一个带有子div的父div，我希望它们在父div的中心垂直对齐，就像一个居中的列。这是我的代码 http://jsfiddle.net/yX3p9/344/

<div class="wrapper">

    <div class="table-body">
        <div class="topchair">
            <div class="chair">1</div>
        </div>

        <div class="leftchairs">
            <div class="block">
                <div class="chair">3</div>
                <div class="chair">4</div>
                <div class="chair">5</div>
                <div class="chair">6</div>
            </div>
        </div>
    </div>

</div

我也尝试过显示：table-cell; vertical-align：middle;但它也没有用，我该怎么办。提前谢谢。

Answer 1

如果我理解你纠正了这个：

.chair {
    width: 50px;
    height: 50px;
    margin: 5px auto;         <---  Use auto to center element left/right
    background: deepskyblue;
    line-height: 50px;
    font-weight: 600;
    color: #fff;
    text-align: center;
}

与两个条目一起使用的边距标注（顶部/底部左/右）如果元素具有固定宽度，则auto将使其居中...

如何将子div垂直居中放在父div的中心？

1 个答案: