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
float解除 « (X)HTML+CSS Tips « XHTML+CSS Webサイト制作Tips « ScuderiaWeb
tableタグによるレイアウトではなく、divタグのfloatによるレイアウトが主流となっていますが、floatを解除する方法については様々な議論が交わされています。 正解というものはありませんが、ScuderiaWebで使用しているfloat解除方法をご紹介します。 サンプル float解除サンプル（別ウィンドウで表示） ソース 上記サンプルで使用しているソースです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
