HTMLとCSSについて質問です。。

下記のようにコードを書いた場合、文字を拡大したときに「div id="maincontents"」の中の文字等がふくれあがって、「div id="sidebar"」が下に落ちてしまいます。
どうしたら下に落ちないですみますでしょうか？

※InternetExploreで起ります。他のブラウザでは起りません。
※フォントサイズはあえて固定していません。

◆HTML

<div id="container">

<div id="maincontents">
</div>

<div id="sidebar">
</div>
</div>

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

◆CSS
div#header{
position:absolute;
top:0px;
}
div#container{
width:760px;
background-color:#e5ecf8;
}
div#maincontents{
width:75%;
float:left;
background-color:#FFFFFF;
}
div#sidebar{
width:25%;
float:right;
}