CSS: Как установить несколько div в одну строку с шириной 100%?

Question

Подобный вопрос был здесь , но мои div'ы не имеют фиксированного размера вообще. Мне нужно следовать структуре:

<div style="float:left;"></div>
<div style="float:left;"></div> <!-- this div should be what's left after the first and third divs -->
<div style="float:right;"></div>

Я пытался установить overflow:hidden; для второго div, но это не помогает.

Answer 1

Вы можете достичь с помощью комбинации white-space & display:inline-block, например:

HTML:

<div class="parent">
    <div class="child">1</div>
    <div class="child">2</div>
    <div class="child">2</div>
</div>

CSS:

.child{
    display:inline-block;
    *display:inline; /* for IE7*/
    *zoom:1;/* for IE7*/
    min-width:100px;
    min-height:50px;
    margin-right:10px;
    background:red;
    white-space:normal;
}
.parent{
    white-space:nowrap;
}

http://jsfiddle.net/QdvFp/1/