html - 将任何 div 保持在水平中间

Question

我有两个固定大小的 div，即使我重新调整屏幕大小，我也想让它们水平居中。即使我为低屏幕删除了一个 div，我也想将另一个放在中间。

这是我试过的代码... Fiddle

<div id="wrapper1">
     <div id="one">1</div>
     <div id="two">2</div>
</div>

CSS 从这里...

#wrapper1 {
    width: 100%;
    height: 90px;
    margin: 0 auto;
}

#wrapper1 #one {
    width: 200px;
    height: 90px;
    background: white;
    display: inline-block;
    box-shadow: 0 0 5px #AAAAAA;
}
#wrapper1 #two {
    width: 100px;
    height: 90px;
    margin-left: 10px;
    background: white;
    display: inline-block;
    box-shadow: 0 0 5px #AAAAAA;
}


@media screen and (max-width: 400px) {

    #wrapper1 #two {
        display: none;
    }

}

Answer 1

Demo

text-align:center 到您的父 div 将使所有子 div 都位于中心。

CSS

#wrapper1 {
    width: 100%;
    height: 90px;
    text-align: center; /* add just this to make child elements center in parent div */
}