[CSS]リキッドレイアウト上で、floatさせたサイドバーの背景画像を高さ100%で敷き詰めたい

質問

今ヘッダフッタ付きの3カラムブログデザインを作っています。
leftnaviとrightnavi（サイドバー/メニュー）の間にmaincontents（ブログのメイネントリ）が挟まるような、まあ一般的なブログデザインです。

で、質問なんですが、leftnaviとrightnavi（サイドバー/メニュー）に背景画像を敷き詰めたいんです。
ブログですので、基本的にはmaincontents（エントリ）の方がサイドバーよりもheightが大きくなってしまいます。

その際、サイドバーの背景が、記述されたメニューの部分までしか反映されません。これについて、エントリ部分の高さまで敷き詰める方法を教えて頂けませんでしょうか？

色々調べたところ、（http://css-happylife.com/log/css-template/000028.shtml）こちらで、width固定デザインの際にcontainerに背景画像を指定する方法が紹介されていました。

ただ、今回お伺いしたいのは、containerのwidthを%指定するリキッドデザインの場合、です。左右のサイドバーにはそれぞれ別の背景画像を指定したいと考えているのですが、それは可能なのでしょうか？

回答No.1

grumpy_the_dwarf

ちょっとした思いつきですが、
<div id="leftnavi">
　<div id="rightnavi">
　　<div id="main_contents">
　　メインのエントリ
　　</div>
　　<div right_box>
　　右メニュー
　　</div>
　</div>
　左メニュー
　</div>
</div>

こういう構造で、rightnaviだけ右フロートで他を全部左フロートに
すると、イケます。ただし、main_contentsが他より十分長いことが
条件です。メニューの方が長いと、溢れます。

div要素の入れ子関係が論理的に美しくないんですけどね。