<div>タグでサイドバーを作るときの幅の指定方法

全体を囲むdivの中にサイドバーとメインコンテンツ用のdivを入れたいと思っています。

<div id="allContents" style="width:100%;">
　<div id="sideBar" style="float:left; width:200px;"></div>
　<div id="main" style="float:right;"></div>
</div>


で、このときに、右側に表示される#main部分の幅を「残り全部」にしたいのですが、
widthに何を指定したら良いのでしょうか？

サイドバー部分が200px固定で、残りのメイン部分の幅はブラウザの右端までにしたいのです・・。

（Javascriptで#main部分の長さを取ろうと思っているので、中に何も入っていなくても
　divの大きさが一杯までなるようにしたいのです・・）

ご教授よろしくお願いします。

No.1 回答者： metametamu 回答日時： 2011/11/05 16:07

#mainにfloatとwidthを指定しなければ自動的にご希望のレイアウトになると思います。

#allContentsについてもwidth:100%;はおそらく不要でしょう。

一応floatについてもう少し挙動の詳細を調べられることをオススメします。
CSSの中でもコピー＆ペーストだと苦労する部分ですので。

No.2 ベストアンサー 回答者： ORUKA1951 回答日時： 2011/11/05 16:33

巾を％で指定したサンプルは

　floatによる段組について - Webデザイン・CSS - 教えて！goo ( http://oshiete.goo.ne.jp/qa/7079628.html#a7 )にあります。
　ここで、
div.header,div.section,div.footer{
width:100%;margin:0 auto;/* センター配置IE5,非対応 */
border:solid 1px rgb(255,200,200);background-color:rgb(255,200,200);
}
で巾いっぱいで、ナビゲーション(目次)は30%

とか。その他の値を変更すると、目次を200pxで残りを本文とか自在に出来るでしょう。