PDA

View Full Version : Fixed position images



daemonkin
Jun 4th, 2009, 12:27 PM
Hi guys.
Got a flowery design that a client wants to be placed left side of screen and inverted on opposite.

Now, I am cofident enough to position a background image:


body {
background-image: url(/images/uel_left_bg.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: left;
}


but I was just wondering if it is possible to do with 2 images.

D.

Kristofa
Jun 4th, 2009, 06:59 PM
Hi guys.
Got a flowery design that a client wants to be placed left side of screen and inverted on opposite.

Now, I am cofident enough to position a background image:


body {
background-image: url(/images/uel_left_bg.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: left;
}


but I was just wondering if it is possible to do with 2 images.

D.

I suggest you put a div around your whole body, and use the css with the other image on the div. It's not possible to have two background images for one tag I don't think.

That wasn't explained to well. Here's an example:

body {
background-image: url(/images/uel_left_bg.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: left;
}
#bg {
background-image: url(/images/uel_left_bg.jpg);
background-repeat: no-repeat;
background-attachment:fixed;
background-position: right;
}



and for your page:

<body>
<div id="bg">
the rest of your stuff...
</div>
</body>


If you need the image to be refected as such, you will need to do this before you upload the image.

daemonkin
Jun 5th, 2009, 10:24 AM
:thumbsup: Worked a charm. In almost every other use of fixed backgrounds i have found they only work in body tags. :eek:

Regards,
D.