Brian Mains
Brian Mains

Reputation: 50728

Controlling a background image position of the body

I was wondering if it's possible to affect the positioning of the body; I have a 500 x 500 pixel image I have positioned in the center of the page, set not to repeat. I was wondering if it's possible to skew the positioning somehow so that it appears 20 pixels down from the center, as I have a larger header that overlays the background.

Any ideas?

Thanks.

Upvotes: 2

Views: 3586

Answers (3)

orandov
orandov

Reputation: 3276

If you are not particular about offsetting exactly 20px you can use a percentage to offset the y coordinate of the background. Here is an example:

background-position:50% 55%;

Here is a link for more info: http://www.sitepoint.com/blogs/2007/07/05/css-using-percentages-in-background-image/

Upvotes: 2

Robusto
Robusto

Reputation: 31883

Investigate the use of background-position rule in CSS. It takes 2 values, separated by a space, like so:

background-position: left center;

or

background-position: 50px 100px;

They are in X Y order.

Upvotes: 0

Oli
Oli

Reputation: 239810

Make your background image 40px taller at the top. That will shunt the image down 20px.

You could try hacking around with divs and margins but making the image taller has the same effect without causing hair-loss.

Upvotes: 1

Related Questions