Centering after re-size

[Malik]

Hello everyone, hopfully one of you can help me. Look at the way the yahoo http://www.yahoo.com/ or Google http://www.google.com/ websites center on the page at a browser setting of 1024x768 as opposed to aligning to the right like my website. Then at an 800x600 setting they fill the window perfectly.
Getty http://creative.gettyimages.com/source/home/home.aspx takes it a step further by centering vertically as well. Do any of you tech-warlords know how this is done?

[jscheuer1]

There is no one way to do this sort of thing. I'd suggest looking at the source code of sites that do it, to get an idea of some of the different methods. I currently favor using at least a transitional/loose DTD and a container division of fixed width with left and right margins set to auto.

A lot depends upon your content. If you do not constrain your content in any way, it generally will fill the space available, but will lay out differently in different sized windows. This can be fine as long as it looks OK at each size. The trap many designers fall into is wanting everything to look the same at all resolutions/window sizes and in all browsers. That is nearly possible but, a real headache and can never be done 100%.

[ddadmin]

There are many ways to center the layout of a page. Using CSS, for example, the below container div is centered:


<style type="text/css">
#containerdiv{
margin-left: auto;
margin-right: auto;
width: 870px;
}
</style>

<div id="containerdiv">
page content there...
</div>

Setting a container's left and right margins to both "auto" is the key here.