The #main div needs to follow the #container_right in the html.
See http://www.wickham43.supanet.com/for...ray060526.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
body{ margin: 0; padding: 0; background-color: #666; }
div#header{ width:100%; height:100px; background-color: black; color:white; }
div#container_main{ width:100%; border: thin solid red; }
div#main{ margin: 0; height: 300px; background-color: yellow; border: thin solid black; }
div#container_right{ width:250px; float:right; border: thin solid white; }
div#right1{ margin: 0; width:200px;background-color: orange; border: thin solid black; float: left; }
div#right2{ margin: 0; width:200px;background-color: white; border: thin solid black; float:left; }
div#right3{ margin: 0; width:200px;background-color: green; border: thin solid black; float:left; }
div#footer{ width:100%; height:50px; background-color: orange; color:black; }
</style>
</head>
<body>
<div id="header">This is the HEADER</div>
<div id="container_main">
<div id="container_right">
<div id="right1">
<p>RIGHT 1</p>
</div>
<div id="right2">
<p>RIGHT 2</p>
</div>
<div id="right3">
<p>RIGHT 3</p>
</div>
</div>
<div id="main"> <p>HELLO WORLD</p> </div>
</div>
<div id="footer">This is the FOOTER</div>
</body>
</html>
Code downloaded to my PC will be deleted in due course.
WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.