Align 2 divs side by side

Question

I need to align 2 divs side by side. They are located inside the wrapper, which does not have a fixed height.

My problem is that when I use float: left and float: right respectively, the div is not displayed to “stay inside” the div wrapper (I can say that the div wrapper has a different background color on the page, and this does not apply to 2 divs I want to post).

Basically, I need 2 divs to be side by side, but in this shell.

Apologies for the [very bad] attempt to describe this problem, I do not work very much on the design.

Answer 1

Add overflow:hiddena div to the wrapper.

Answer 2

CSS

.table 
{
border: 2px solid #000;
display: table;
}
.row
{
display: table-row;
}
.cell{
display: table-cell;
border: 2px solid #ccc;
}
.leftcell{width: 200px;}
.rightcell{width: 100px; }

HTML

<div class="table">
<div class="row">
<div class="cell leftcell">left cell</div>
<div class="cell rightcell">right cell<br/>multiline</div>
</div>
</div>

90- .