Центральные дочерние div внутри родительского div - программирование

Центральные дочерние div внутри родительского div

У меня есть родительский 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>

Вот пример кода:

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

Спасибо!

4b9b3361

ОТВЕТЫ

Ответ 1

Попробуйте использовать 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/