...

View Full Version : Vertical centering/centering in HTML..



jim5358
01-20-2012, 03:02 PM
Massive thanks to "Arbitrator" from Texas for some help with image resizing - now for my (hopefully!) final question...
I've written my first site in HTML5/CSS and other than a bit of tidying up its finished...with the exception of it being 'centred' on a vertical as well as horizontal basis. I'd like to see it sitting in the middle of the screen when its viewed on anything bigger than 17" monitor.
Can anybody advise me on this? The site URL is: www.chrisandersonarchitects.co.uk

Many thanks,

Jim :thumbsup:

Excavator
01-20-2012, 04:46 PM
Hello jim5358,
Most vertical centering works by knowing the height of the element you're centering. See these examples (http://nopeople.com/CSS%20tips/vertical%20center%20with%20CSS/index.html).

For a fluid height element like your .container to be centered, have a look at this jQuery solution (http://www.seodenver.com/simple-vertical-align-plugin-for-jquery/).

jim5358
01-20-2012, 09:06 PM
Many thanks for your reply - I've read through the links, I'm just a little unsure how/where to paste in the text...? :/:confused:


Hello jim5358,
Most vertical centering works by knowing the height of the element you're centering. See these examples (http://nopeople.com/CSS%20tips/vertical%20center%20with%20CSS/index.html).

For a fluid height element like your .container to be centered, have a look at this jQuery solution (http://www.seodenver.com/simple-vertical-align-plugin-for-jquery/).

Arbitrator
01-21-2012, 08:02 AM
I've written my first site in HTML5/CSS and other than a bit of tidying up its finished...with the exception of it being 'centred' on a vertical as well as horizontal basis. I'd like to see it sitting in the middle of the screen when its viewed on anything bigger than 17" monitor.I think you're going to find this task to be a lot more difficult than you bargained for. This is why I did not address your comment on the subject in your previous thread; it's too much work to conditionally vertically align content to the browser viewport for only a minor aesthetic improvement.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum