floatしたdivの高さを揃える « (X)HTML+CSS Tips « XHTML+CSS Webサイト制作Tips « ScuderiaWeb

tableレイアウトからdivのfloatによるレイアウトに変更した際に、デザイン面で困ることがいくつかありますが、その1つが、floatしたdivの高さが揃わないこと。 floatしたそれぞれのdivに背景画像や背景色を設定していたり、borderでラインを入れている場合など、高さが揃わないため、情報量が少ないdivの下に隙間が空いてしまいます。 そういった問題を解決する方法です。 サンプル floatしたdivの高さを揃える 高さが可変（別ウィンドウで表示） floatしたdivの高さを揃える 高さ画面いっぱい（別ウィンドウで表示） ソース（高さが可変） floatされたdivの中で、もっとも高さがあるものに他のdivの高さも合わせる場合です。 float解除用のclass="cl"についてはfloat解除を参照してください。 html,body { margin: 0; paddin

[coringo15]

floatしたdivの高さを揃える

[phista]

IQでもやってたな… overflow: hidden !important; overflow: visible; min-height: 100%; height: auto !important; height: 100%;

[okishima_k]

高さの異なるカラムを揃える

[site159]

古いけど　これ　やってみようかなあ　効果アルのかなあ　バグはないのかなああ

[tyage]

よく忘れる

[daikix]

買ったテンプレートで疑問だったけど、これ見てすっきり。