Re: centering a floated item

[koewnet]

Considering you’d only know the width of the sidebars, you could float the divs (left and right) above the main content-div. This, of course, wouldn’t be good for SEO nor accessibilty as you’d have to heap through the sidebars before the content.

Right after the body-start:

Code:

This is above the #page-wrap

This is below the #page-wrap

…then the CSS:

Code:

body { margin: 0; padding: 0; }
#page-wrap { width: auto; border-top: 1px black solid; border-bottom: 1px black solid; }
#left { width: 200px; float: left; background-color: #0f0; }
#right { width: 200px; float: right; background-color: #c0c; }
#main { width: auto; padding: 0 5px; margin: 0 205px; background-color: #0fe; }
.clearboth { clear: both; height: 1px; }
p { font-weight: bold; }

In this example you only give the #main margins, and the sidebars gets fixed widths. If you’d use this I’d recommend using overflow: hidden; on the sidebars, to not interrupt with the main content area.