Feature #2: Blocks with float do not influence on the height of parent!

Block div.container contains two blocks div.left и div.right. Both are a property of float. They do not influence on the height of paternal div.container.

Solution #1. Obviously to set the height of parent.

Solution #2. To place in the end an element with clear: both.

Solution #3. To apply overflow property.

HTML code:

<div class="container">
    <div class="left">
        ...
    </div>
    <div class="right">
        ...
    </div>
    ...
</div>

Live example ↓

div.left

.left
{
    border: 2px solid #33F;
    float: left;
}

div.right

.right
{
    border: 2px solid #F00;
    float: right;
}
div.container { background-color: #CCC; border: 1px dashed #333; }
Window size: x
Viewport size: x