试图让3个div在div中居中

Question

您好我试图在div中居中3个div。

＆＃13;

＆＃13;

.outer {
    border: 1px solid blue;
    width: 80%;
}

.inner {
    border: 1px solid red;
    float: left;
    width: 20px;
    height: 20px;
    margin-left: 20px;
}

.clear {
    clear: both;
}

＆＃13;

<div class="outer">
    <div class="inner"></div>
    <div class="inner"></div>
    <div class="inner"></div>
    <div class="clear"></div>
</div>

＆＃13;

＆＃13;

＆＃13;

有人可以为此提供帮助。

感谢。

Answer 1

如果您想实现this：

HTML：

<div class="outer">
    <div style="display: inline-block;">
        <div class="inner"></div>
        <div class="inner"></div>
        <div class="inner"></div>
    </div>
</div>

CSS：

.outer{
    border: 1px solid blue;
    width: 80%;
    text-align: center;
}

.inner:first-of-type{
    margin-left: 0px;
}

.inner{
    border: 1px solid red;
    width: 20px;
    height: 20px;
    margin-left: 20px;
    float: left;
}