CSS - vertically aligning body background images

2008-03-25

How can I vertically align a background image for the page body so that it will always appear in the middle and have equal space above and below the image? I tried using centre and 50% but it just moves the image to the top and then hides 50 half of it out of sight.

FredVaux.com | LightFused.net

Nutrox · 2008-03-25 #2

Set the HTML height to 100% and add the background image to that.

Code:

html
{
    height:100%;
    background:#FFFFFF url( myimage.jpg ) no-repeat fixed center center;
}

That has always worked for me.

Thread Tools
Show Printable Version Email this Page
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:


	Ultrashock Forums > Development > Client Side • CSS - vertically aligning body background images


		You are currently viewing our website as a guest which gives you limited access to forums, files and other resources. Click here to join now for free, and start interacting with our members, download files and much more! Click here if you are looking for our Flash files and other professional assets.

	Nutrox 17 Creative Assets	2008-03-25 #2
	Set the HTML height to 100% and add the background image to that. Code: html { height:100%; background:#FFFFFF url( myimage.jpg ) no-repeat fixed center center; } That has always worked for me.