I am currently working on a website with the following structure:
<body>
<div id="container">
<!-- all content goes here -->
</div>
</body>
My challenge is to center the page without using float,
The body has a background color of #ddd, while the container has a background color of #fff,
However, the white background of the container does not show unless I set a min-height or height in pixels (float property is not compatible),
The CSS code for the #container is as follows:
#contenedor{
display: block;
background: white;
width: 1024px;
padding: 44px 2px 2px;
position: relative;
margin: auto;
}
You can test it out here: http://jsfiddle.net/bfzWN/