Question

basicaly I have the following HTML/CSS Layout

HTML:

<div id="container">
    <div id="main">
        <h1>TEST</h1>
    </div> 
</div>

CSS:

#cont {
  width: 100%;
  background: #ddd;
}
#main {
  width: 900px;
  background: #fff;
  margin-left: auto;
  margin-right: auto;
}

This works fine in FF, safari, Chrome and Opera but IE8 still aligns the “main” div to the left.

Does anyone know what the problem might be? Thanks in advance.

Answer 1

You just need to change either the css #cont to #container or the id of the div to cont.

Works fine for me in IE8. http://jsfiddle.net/5M6X9/