カラムの高さを揃える

質問

添付した画像のようにスタイルを書いてます。

左カラムには<div class="boxLEFT">を2つ使っており、
下の<div class="boxLEFT">と右カラム<div class="boxRIGHT">の
天地を合わせたいのですが、どのように行えばよろしいでしょうか？

javasprictでもcssでも構いません。
初心者なので、難しいと分からりませんので、
お手柔らかに教えてください。

よろしくお願いします。

回答No.1

amuamu00

左下のboxLEFTをカラムA、右のboxRIGHTをカラムBとさせて下さい。

おそらく、カラムAとカラムBの底を同じ用にするのは無理です。
方法があるとすれば、全カラムに対してheightを指定して、同じ高さにするしかありません。
しかし、そういった方法を望まれているわけではないと思います。

多分ですが、背景を揃えたい、ということですよね？
カラムBが伸びた場合は、カラムAの背景も下に延びる、、、というような形だと思います。
的外れだったら申し訳ないですが、これであれば方法があります。
それは、カラムAでもBでもなく、「contents」に背景指定することです。
そうすれば、カラムAが延びれば自動的にcontentsの背景が延びることになるので、
擬似的にカラムBが延びているかのように見えます。

このとき、contentsの背景に指定する画像は、CSSでrepeat-yにすること、
カラムAとカラムBにfloatを使っているのであればclear:both;等で解除すること、
背景画像はカラムAの背景とカラムBの背景を合わせたようなものを作ること、
などが必要になります。

お礼

丁寧にお教えいただき、ありがとうございます。

contentsには背景画像を使用しないで、カラムごとに背景をつけてそろえたかったので、
無理ということが理解できただけでもありがたく思います。