« 2009年3月 | トップページ | 2009年7月 »

2009年5月

高さの異なるカラムを揃えるスタイルシート

2カラムや3カラムで背景色などが入っている場合、
片方が短かったりすると背景色が途中で途切れたりしてしまいます。

今まではjsで揃えていたのですが、あるシステムへ組み込みしなければならず、jsを使うのが大変そうだったので調べたところ、それを解決できる、高さの異なるカラムを揃えるCSSがありました!



[CSS]高さの異なるカラムを揃えるスタイルシート



それぞれのカラムに、同じ数値で、プラス値のpadding-bottomと、マイナス値のmargin-bottomを指定し、そのカラムを囲っているdivへ「overflow: hidden;」を指定するだけ。

これでばっちりできました!
IE、Firefox、Safari、Opera等で動作確認できました!

« 2009年3月 | トップページ | 2009年7月 »