Hi all

I have 3 columns all within a fixed width. The right column (float:right) is wayyyy out to the right when viewed in IE7. Any ideas?

Code:
body {
width:760px;
margin:10px;
font-size:80%;
font-family:'Lucida Grande',Verdana,sans-serif;
}

h1 {
font-size:150%;
}
h2 {
font-size:140%;
}
h3 {
font-size:120%;
}

p {
font-size:100%;
line-height:150%;
}

#masthead {
margin:0 0 10px 0;
padding:10px;
border:1px solid #000;
background-color:#CCC;
width:738px;
}

#content {
margin-left:200px;
margin-right:200px;
margin-bottom:10px;
padding:10px;
border:1px solid #000;
width:338px;
}

#sidebar_a {
float:left;
margin-bottom:10px;
padding:10px;
border:1px solid #000;
width:158px;

}


#sidebar_b {
float:right;
margin-bottom:10px;
padding:10px;
border:1px solid #000;
width:158px;

}

#footer {
clear:both;
padding:10px;
border:1px solid #000;
background-color:#CCC;
width:738px;

}
Heres the basic 3 column html

HTML Code:
<html>
<head>
<title>Fixed Floated 3 Column Layout</title>
<link rel='stylesheet' media="screen" type='text/css' href='ff3c.css' />
</head>
<body>
<div id="masthead">
<h1>Masthead</h1>
</div>
<div id="sidebar_a">
<ul>
<li>sidebar a</li>
<li>item one</li>
<li>item two</li>
<li>item three</li>
<li>item four</li>
<li>item five</li>
</ul>
</div>
<div id="sidebar_b">
<ul>
<li>sidebar b</li>
<li>item one</li>
<li>item two</li>
<li>item three</li>
<li>item four</li>
<li>item five</li>
</ul>
</div>
<div id="content">
<h2>Content</h2>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc quis nibh. Morbi sit amet risus. Donec sit amet massa nonummy massa semper porttitor. Aliquam vel quam. Vestibulum laoreet elementum eros. Ut gravida arcu at pede. Phasellus enim lorem, ultricies nec, molestie rhoncus, auctor eget, odio. Suspendisse mollis massa nec odio. Fusce eget enim. Quisque at tortor. Duis sed ante. Suspendisse lobortis erat venenatis lectus lobortis ultricies. Praesent ac dolor ut eros ornare auctor. Quisque hendrerit, nisl a porta pretium, urna nisl adipiscing nunc, at fermentum nunc elit et sem. Morbi lorem lacus, rutrum a, commodo eu, sagittis ac, erat. Vestibulum mauris felis, aliquam sit amet, porttitor posuere, blandit adipiscing, velit.
</div>
<div id="footer">
<h2>Footer</h2>
</div>
</body>
</html>
Any help would be much appreciated. Ive tried it in Firefox and it looks fine...Just the pesky IE7...