画面全体を埋めたい 2 つのフローティング列を持つ Web サイトを設計しています。
#column_main{
position:relative;
background:#ffffff;
float:left;
width:70%;
height:auto;
min-height:550px;
}
#column_side{
position:relative;
background:#dbdada;
float:left;
width:30%;
height:auto;
min-height:550px;
}
#column_main に以下の行がある場合
border-left:solid 1px #c0c1c4;
フロートがぐちゃぐちゃになって、もう並んでいません。
IE では、#column_main の幅を auto に設定することで問題を解決でき、ページの残りの部分を埋めました。これは Firefox では機能せず、パーセンテージを少し減らしてみましたが、#column_main とページの右端の間にギャップが残ります。左側に 1px の境界線を配置し、画面の残りの部分をフロートで埋める方法はありますか。