Firefox CSS Issue

Hey everyone. I just created a CSS page, and it looks great in IE, but Firefox doesn't seem to be aligning things correctly. For some reason, the main content all ends up on the left of the page rather than where it's supposed to be. The page is www.diy-ha.com
Here is my stylesheet:

html, body {
margin: 0;
padding: 0;
font: 12px Verdana;
color: #600000;

height: 100%;

line-height: 1.4em;
text-align: center;

background-color:#e7e7e7;
background-image: url("body_bg.jpg");
background-repeat: repeat-y;
background-position: center;
}
p { padding: 0; margin-bottom: 7px; margin-left: 0; margin-right: 0; margin-top: 0; color: #000; }
div#Main {
text-align:center;
width:748px;
}
div#Header {
width: 748px;
height: 170px;
float:left;
}
div#Layer1 {
position:relative;
width:146px;
z-index:1;
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
float:left;
background-color: #F9FD24;
border-right:solid;
border-right-color:#000000;
border-right-width:4px;
border-bottom:solid;
border-bottom-color:#000000;
border-bottom-width:4px;
}
div#Menu{
margin-left:0px;
text-align:center;
font-size:10px;
font-color:#000000;

}
div#MainText{
position:relative;
width:600;
float:right;
}
div#MainTextContent {
margin-right:30px;
margin-left:30px;
}

Any idea what might be confusing Firefox?

Thanks
Tom

 

Here's the BrowserShots page for it:
http://browsershots.org/website/http://www.diy-ha.com/
Tom

 

I see no particular difference, Firefox to IE. You do have some minor errors in the html you might want to fix.

cheers,

gary