Hi!

 

I need some help. I want to vertically center my web site.

Horizontally is ok. How can i do that?

 

www.aphotoquest.com

 

 

Thanks in advance!

Chris

There is a method that uses:-

#wrap { position: absolute; height: ??px; top: 50%; margin-top: -??px; }

 

where the wrap div encloses everything between the <body> and </body> tags and the negative margin-top is always half the height.

 

I don't think it would work well with your page because you have quite a lot of height. When someone looks at the page with a window that is less high than the wrap div, the top of the page disappears off the top of the window where you can't scroll to see it.

 

Look at this example:-

http://www.wickham43.net/centerphotolink.php

 

and drag the window height to less than the image height and the top part will disappear where you can't scroll, so the method is only suitable for pages or images with a small height.

have a look at this tutorial on my site:

 

How to vertically center a site

 

 

unlike the example wickham has given this method won't disappear off the top of the screen, once the site hits the top of the window it will produce the scrollbar so no content is lost

 

here's the example:

http://webdesignpond.co.uk/templates/vertical/one/

 

which you can download from this page if you would rather have a working example then a tutorial:

http://webdesignpond.co.uk/wdp/freebies/basic-vertical-centered-css-templates/

thanks so much dizi , well handy post