{Margin : auto}, in IE and Mozilla

programming web dev
1

I’ve created a 2 column layout based on the faux columsn tutorial at a list apart.

However, when I’ve set up the same php and css files using the Mambo Content management system I am having a problem with my wrapper element.

if you look at my site club digital in mozilla or safari the content appears in the correct place. However if you look at it in IE then the main body stays aligned to the left?

I’ve narrowed it down, i think to being a problem with the “auto” in the #wrapper margins.

heres my CSS code any help would be good. I’ve been through 2 css books and loads of sites and cant find anything :h:

body{
font:Arial, Helvetica, sans-serif;
margin:0 0 0px 0;
padding:0;
background: #000000 url(../images/back2.jpg) repeat-y 50% 0;
}

#header{
padding:0;
margin:0;
height:250px;
text-align:center;
}

#nav {
padding:0px;
margin:0px;
height:20px;
background-color:#000000;
width:700px;
}

#wrapper  {
color : #000;
margin : 0 auto 15px;
width : 690px;
voice-family: "\"}\"";
voice-family:inherit;
width:690px;
}

html>body #wrapper {
width:690px;
}

#main{
float : left;
width : 200px;
text-align : left;
padding : 0;
margin: 0 0 0 10px;
line-height : 140%;
background : transparent;
height : 100%;
}
	
#right  {
margin: 0 0 0px 205px;
padding : 0;
text-align : left;
border : 0 none inherit;
font:Arial, Helvetica, sans-serif;
color:#999;
font-size : 12px;
line-height : 140%;
 height : 100%;
}