css - アレンジ方法他の2人の下？

Question

<div>3つのサブを持つを実装しようとしています<div>（画像を参照）

div1 には画像があり、その高さは .css のように固定されています

.image_inside_div1
{
height:6em;
}

.div1
{
float:left; /* so it fits to the image */
}

.div2
{
width:50%; /* not a great solution. How do I fill the rest (remaining from div1) of outerdiv's width? */
}

.div3
{
/*This is my primary question. How do implement div3 ?*/
width:100%;
position: ???
bottom: 0 ???
height: ???
}

ありがとう！

Answer 1

div1とdiv2の両方を別のdivでラップします。それだ。

<div>
    <div>
         <div id="div1"></div>
         <div id="div2"></div>
    </div>
    <div id="div3"></div>
</div>

Answer 2

このフィドルhttp://jsfiddle.net/C6Q46/をチェックしてください。重要なビット

.outer:after { content: " "; display: block; overflow: hidden; clear: both; height: 0; }
.div2 { overflow: hidden; }
.div3 { width: 100%; clear; both; }

Answer 3

.div3
{
/*This is my primary question. How do implement div3 ?*/
width:100%;
float: left;
clear:both;
}