また、レスポンシブルレイアウトに対応させるために、CSSで各要素を横並びしたりすることがよくあります。
そんな時に、背景色等の問題で高さを揃えたい時に使えるテクニックです。
親コンテンツに対してのCSS
親コンテンツには、
- min-height: 100%;
- overflow: hidden;
を指定しておく。
子コンテンツに対してのCSS
子コンテンツには、
- padding-bottom: 32767px;
- margin-bottom: -33767px;
- height: 100%;
を指定しておく。