SEOと相性がいいのでCSSレイアウトが流行ってますが、慣れない人には本当に難しい！
せっかくできたと思ったのに、ブラウザによって表示がずれてしまったり。。。
たいていfloatでスタイル指定してるのが原因ですね。
float指定のレイアウトには未知のバグが大量にあるようです。
って事でこれからCSSレイアウトはposition:absoluteが主流ですね。

[html]
<div id="container">

<div id="header">ヘッダー</div>

<div id="contents">
<div id="content">コンテンツ</div>
<div id="navigation">ナビゲーション</div>
</div>

<div id="footer">フッター</div>

</div>

#contentを#navigationよりも前に書くのが今風。
ようは携帯で見たときにこっちの方が便利だから。

[CSS]例：左ナビゲーション、幅780px
*{ margin: 0; padding: 0}
body{ width: 100%}
#container{ position: relative; width: 780px}
#header{ width: 100%; height: 150px}
#contents{ position: absolute}
#content{ margin-left: 200px}
#navigation{ position: absolute; top: 0px; left: 0px; width: 200px;}
#footer{ width: 100%; clear: both}

CSSのleftをrightに書き換えるだけで右ナビゲーションのレイアウトができあがる。
超お手軽でブラウザやウィンドウサイズに影響を受けないCSSレイアウトの完成です。
ただし、コンテンツよりナビゲーションの方が長い場合フッターにナビゲーションが重なることがあります。
そんな危険性を回避するためには、#content内にフッターを入れてしまうか、#contentのmin-height:を指定するか（実はIEだと上手く動作しないみたい）#contentのmargin-bottomに余裕を持たせるかすれば解決できます。
面倒臭いけど、float指定をして未知のバグを連鎖誘発するよりは効率的です。


参考文献：
・Css Cookbook (Cookbooks (O'Reilly))
・Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト