Question

我试图将一个容器中心放置一排方形div。然而，只是试图让它工作，我已将它减少到容器内的单个方块。它需要自动宽度，但也需要居中。如何将使用自动宽度的容器div居中？当它的宽度固定时，它似乎只是将“面板”div居中。

HTML FILE  

<div class="panel">
    <div class="item"></div>
</div>

CSS FILE

.panel {
    position:absolute; /*This seems necessary to get the auto width to work.*/
    margin: 10px auto;

    border-style: solid;
    border-color: #000000;
}

.item {
    width: 50px;
    height: 50px;
    margin: 30px;

    border-style: solid;
    border-color: #000000;
}

我最终会在面板中添加更多项目。

Answer 1

我不确定你的问题究竟是什么，但你不需要使用绝对/固定位置或左/右浮动来使内部div居中。要使内部div居中，您可以使用margin-left: 50%减去margin: 30px，并且您的内部div将居中。的 JSFIDDLE

具有自动宽度的自动保证金

1 个答案: