Why does IE ignore my CSS and how can I fix it?

Why do all IE and AOL browsers display the content of my website on the left side of the screen, ignoring my CSS declarations, while Opera, FF, Flock and Chrome display the content correctly?

website: http://www.mbc-fw.org

CSS:

/* CELTIC CHALLENGE THEME BY PASTOR RICK  */
*{font-family:verdana,tahoma,arial;}

/* REMOVES THE SIDE PAGE MARGINS AND SETS BACKGROUND COLOR  */
body{background:#FEFEFE;color:#000;font:700 14px verdana,tahoma,arial;margin:0;}

/* MULTI-PART LAYOUT  */
#container{margin:0;padding:0;}
#bgtl{background:url(http://www.rbbt.net/skins/PR/celtic/cc-tl.gif) no-repeat left top;height:37px;margin-top:-15px;}
#bgtr{background:url(http://www.rbbt.net/skins/PR/celtic/cc-tr.gif) no-repeat right top;height:37px;margin-top:-37px;}
.bgtmid{background:url(http://www.rbbt.net/skins/PR/celtic/cc-tmid.jpg) repeat-x center 0;height:15px;margin:0 auto;}
#bgtlc{background:url(http://www.rbbt.net/skins/PR/celtic/cc-tlc.gif) no-repeat left top;height:35px;margin-top:0;}
#bgtrc{background:url(http://www.rbbt.net/skins/PR/celtic/cc-trc.gif) no-repeat right top;height:35px;margin-top:-35px;}
#bgleft{background:url(http://rbbt.net/skins/PR/celtic/bg-left.gif) left top repeat-y;font-size:12px;margin:0;min-height:100%;overflow:hidden;}
#bgright{background:url(http://rbbt.net/skins/PR/celtic/bg-right.gif) right top repeat-y;font-size:12px;margin:0 0 -1000px;min-height:100%;padding-bottom:1000px;}

/* SET UP FOR CHURCH NAME AND LEFT-RIGHT LOGO IMAGES  */
#banner{margin:0 auto;width:90%;}
#lbox{background:url(http://mbc-fw.org/images/mbc-fw-logo.gif) no-repeat left top;height:160px;margin-left:5px;开发者_如何学JAVA}
#mbox{margin:0 202px;}
#rbox{background:url(http://mbc-fw.org/images/mbc-fw-logo.gif) no-repeat right top;height:160px;margin-right:5px;margin-top:-160px;}

/* SET UP FOR CHURCH ADDRESS, LOGO TEXT, AND PASTOR'S NAME  */
#logobox{background:#a1b1c1;margin:0 auto;width:100%;}
#lbin{background:#a1b1c1;line-height:30px;margin-left:5px;text-align:left;vertical-align:middle;}
#mbin{background:#a1b1c1;font-style:italic;line-height:30px;margin:-30px 0;text-align:center;vertical-align:middle;}
#rbin{background:#a1b1c1;line-height:30px;margin:-30px 5px 0 0;text-align:right;vertical-align:middle;}

/* SET UP FOR TWO COLUMNS OF TEXT */
#columns {background:#FEFEFE; margin:0 auto;width:90%; overflow: auto;}
#rightcolumn{margin: 10px 0; float: right; width: 48%; font:400 14px verdana,tahoma,arial; line-height: 1.4em;}
#leftcolumn{margin: 10px 0; float: left; width: 48%; font:400 14px verdana,tahoma,arial; line-height: 1.4em;}

#backtotop{background:url(http://www.rbbt.net/skins/PR/celtic/cc-fountain.gif);border:0;font:700 14px verdana;height:100px;line-height:20px;margin:5px auto 0;padding:0;width:100px;}

/* PD MENU  */
#holder{height:33px;line-height:33px;overflow:hidden;position:absolute;right:58px;text-align:center;top:35px;width:225px;z-index:100;}
#holder:hover{cursor:pointer;height:350px;}
#holder a:visited,#holder a{background:#339;border:1px solid #77f;color:#A39B9B;display:block;line-height:18px;text-decoration:none;width:99%;}
#holder a:hover{background:#007;color:#fff;}
#holder p{background:#007;border:1px solid #77f;color:#fff;font:400 14px verdana;margin:-1px 0;padding:0;}

---

I don't have IE handy to test, but your choice of Doctype (HTML 4.01 Transitional with no URI) triggers quirks mode. This causes lots of inconsistencies between browsers, including how IE handles width.

Make sure you trigger standards mode