float で並べた2つの要素の高さを揃える方法

2カラムレイアウトや3カラムレイアウトでdivでfloatするレイアウトを作成することが多いですよね。
また、レスポンシブルレイアウトに対応させるために、CSSで各要素を横並びしたりすることがよくあります。
そんな時に、背景色等の問題で高さを揃えたい時に使えるテクニックです。

親コンテンツに対してのCSS

親コンテンツには、

• min-height: 100%;
• overflow: hidden;

を指定しておく。

子コンテンツに対してのCSS

子コンテンツには、

• padding-bottom: 32767px;
• margin-bottom: -33767px;
• height: 100%;

を指定しておく。