フッターの回り込みを防ぐ方法を教えてください（ＣＳＳ）

質問

ブラウザ：ＩＥ７

左右の二段組みで、左に navi ボックス、右に content ボックスの場合

div#content {float: right; width: 100%; margin-left: -150px; margin-right: auto}

div#navi {float: left; width: 150px}

div#footer {clear: both}

としたのですが、フッターが navi の下に回り込んでしまいます。
{clear: both} は navi の幅 150px の中だけで float が clear されているだけです。

フッターが回り込まないようにするには、どうしたら良いか分かりません。

よろしくお願いいたします。

回答No.2

noname#248056

#content　に　
position: relative
を、追加指定みては？

お礼

ご返事をありがとうございました。

#content に position relative を追加してみましたが、
フッターは #navi の下のままでした。

補足

monzenkozo さん ldrnSTM さん　ありがとうございました。

解決いたしました。

<div id="navi"> に </div> を書き忘れていました。^^;
すみません。
お騒がせいたしました。

回答No.1

monzenkozo

こちらを参考に

http://www.geocities.jp/multi_column/

お礼

ご返事をありがとうございました。

さっそく読んで色々試していますが、まだ解決には到りません。
もう一度じっくり読んでみます。

補足

monzenkozo さん ldrnSTM さん　ありがとうございました。

解決いたしました。

<div id="navi"> に </div> を書き忘れていました。^^;
すみません。
お騒がせいたしました。