IE6のレイアウト崩れ

お世話になります。
下記の内容でレイアウトをしております。
firefox3.08ではほぼ思い通りですが、
IE6では、menuがmainの左下に入り込んでしまい、
mainが真ん中より少し左にずれてしまうのです。
解決策を教えてください。
情報が足らないようでしたら、ご連絡下さい、宜しくお願い致します。

body {
font-size : medium;
}

div#container {
width : 730px;
}

div#header {
font-size : 12px;
width : 725px;
}

div#navi {
width : 725px;
clear : both;
font-size : 12px;
}

.topicpath{
clear : both;
width : 725px;
margin : 3px 0 3px 0;
}


div#main{
float : right;
width : 540px;
}

div#menu{
float : left;
width : 170px;
font-size : 12px;
}


div#footer {
width : 725px;
clear : both;
font-size : 75%;
}



<div id="container">

<div id="header">
</div>

<div id="navi">
</div>

<div class="topicpath">
</div>

<div id="main">
</div>

<div id="menu">
</div>

<div id="footer">
</div>

</div>

No.1 ベストアンサー 回答者： phoenix343 回答日時： 2009/04/12 12:55

IE8でのイメージを添付します。

Menu・Mainラインの幅が他の幅よりはみ出ています。

解決策ではありませんが、
widthがすべてpx指定なのが気になります。
id="container"が親なのですから、その下層は%指定するべきなのでは？
と思いました。

この回答へのお礼

早急なご回答を頂きまして、ありがとうございました。
おかげ様で問題が解決できました。
%指定、勉強になりました。また何かありましたら宜しくお願い致します。

お礼日時：2009/04/12 13:34