36

内部に 3 つの子 div がある 100% のままにしなければならない親 div があります。3 つの子 div を中央に配置する必要がありますが、方法がわかりません。

.parent {
    width: 100%;    
    border: 1px solid blue;
}
    
.child {
    float: left;    
    border: 1px solid red;
    margin: 2px;
}
<div class="parent">
    <div class="child">child1</div>
    <div class="child">child2 - center us child divs! :)</div>
    <div class="child">child3</div>
    <div style="clear: both"></div>
</div>

JSFiddle は次のとおりです。

http://jsfiddle.net/qdHH3/2/

4

3 に答える 3

51

使ってみてdisplay: inline-block、text-align: center

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

.child {
    display: inline-block;  
    border: 1px solid red;
    margin: 2px;
}

jsFiddle: http://jsfiddle.net/qdHH3/3/

于 2012-10-26T17:16:35.547 に答える