html - 隣接する固定サイズのdivでdivの塗りつぶしスペースを作成する

Question

divをコンテナの左下に揃えようとしています：

グリーンは内部の本体コンテナです。黄色はヘッダーdivで、その中にロゴとタイトルがあります。

これで、ロゴ（オレンジのdiv）をに取得した{float:right; width: 30%}ので、内部の画像の幅はdivを超えません。

問題は青いものにあります。オレンジ（画像によって異なります）と同じ高さで、残りのスペースを埋めるようにします。（uが画像で見ることができるように）。また、青いdiv（タイトル）のテキストを左下に揃えたいです。

親子の絶対位置、相対位置、上下の設定をいろいろ試してみました。固定の高さを使用しても機能しますが、divは画像のdivと同じ高さである必要があります。

私はcssについてもっと学ぶので、どんな助けでもいただければ幸いです。

編集：画像の幅はボイラープレートに依存し、画像の寸法は固定されていません。タイトルには、フォーマットされたcss<h1>と<span>forアイコンが含まれます。

EDIT2：私の現在のコード：http：//jsfiddle.net/QxK9U/

Answer 1

画像 div をタイトル div 内にラップすると、画像 div より多くのコンテンツがない限り、タイトル div は同じ高さになります。

<div class="header">
    <div class="title">
        <div class="image"><img src="http://placekitten.com/200/250"></div>
    </div>
</div>

http://jsfiddle.net/Gc5qz/1/

Answer 2

このcssプロパティを試しましたか

bottom:0
left:0

---

アップデート：

   position: relative;