How do they do this?

[blutter]

I want to have my page look similier to this page, meaning everything is centered, and the space that isn't not filled up with content is filled with a gradient on either side, and adjusts automatically for monitor size/resolution. I can't figure out how to do it, if my code would be helpful I'll post it and a link to my site, but just a general idea of how this is done would be nice. Right now my code is all wrapped in a container center it using CSS.

http://www.motortopia.com/main/bikes

And yes, my code is validated.

[felgall]

That page looks to be a mess with everything all over the place certainly not centered. I suppose they only bothered checking it in Internet Exploder and not in any modern web browsers.

1. Make sure you have a doctype as the first tag in your page so as to put IE into standards mode where it at least tries to follow some of the standards.

To align text elements to the centre of the block that contains them use text-align:center

To align blocks to the centre you give them a width and set margin:0 auto

To set up a colour gradient you use a background image.

[blutter]

I think you misuderstood what I meant about the page I referanced. When I say everything is centered I mean the GRAY colored block is centered between the two black gradient side. And it works perfectly fine in both firefox and IE.

[Centauri]

Apart from looking centred to me in FF, the points felgall raises apply to the page in question.

Looking at the site's code will show the content in a div #wrapper. A look at the css shows #wrapper{ border:1px solid transparent; border-bottom:none; border-top:none; margin:0 auto 1.33em auto; position:relative; width:947px} the div is set a width of 947px, and the auto margin does the centre.

The "two black gradient side" is simply the background graphic applied to the body - graphic is here (http://m2.media.motortopia.com/images/bodyBG.gif).

Cheers
Graeme