Gdy otwieram szablon w IE 6, pokazuje się mi jakby dodatkowy margines, taki niebieski pasek i nie wiem jak go usunac.

kod html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/> <link rel="stylesheet" href="test.css" type="text/css" />
kod css
*{ margin: 0; padding: 0; }
body{ text-align: center; font: normal 1em Arial; }
#page{ margin: auto; text-align: left; width: 1000px; }
#menu{ height: 90px; background: #000 url(images/bg_menu.jpg) repeat-x; }
#logo{ height: 340px; background: #000 url(images/bg_logo.jpg) repeat-x; }
#bg_logo{ width: 910px; background: #fff; margin: 0 0 0 45px;}
#picture{ width: 900px; height: 300px; background: #fff url(images/logo_2.jpg); float:left; }
#r_shadow{ width: 10px; height: 300px; background: #fff url(images/r_shadow.jpg); float: left; }
#l_d_shadow{ width: 12px; height: 10px; background: #fff url(images/l_d_shadow.jpg) no-repeat; float:left; }
#d_shadow{ width: 886px; height: 10px; background: #6714f0 url(images/d_shadow.jpg) repeat-x; float: left;}
#r_d_shadow{ width: 12px; height: 10px; background: #fff url(images/r_d_shadow.jpg) no-repeat; float: right;}
#content{ height: 620px; background-color: #fff; }
#post{ width: 910px; height: 620px; background: #000; margin: 0 0 0 45px; }
#l_column{ width: 599px; height: 619px; border-top: 1px solid #e8e7e7; border-left: 1px solid #e8e7e7; background: #fff; float: left; }
#c_column{ width: 300px; height: 619px; border-top: 1px solid #e8e7e7; background: #fff; float: left; }
#r_column{ width: 10px; height: 620px; background: #fff url(images/bg_column.jpg) repeat-y; float: left; }
#footer{ height: 145px; background: #d8d6d6 url(images/bg_footer.jpg) repeat-x; }
#bottom{ width: 910px; height: 90px; background: #ededed; margin: 0 0 0 45px; }
Opera, Mozilla i Chrome wyswietlaja strone poprawnie.
Trochę historii...