...

View Full Version : Double background images overlaying



ndm250
06-21-2011, 09:02 PM
I need two background images to be overlapped. One just being plain gray that repeats but doesn't create scroll-bars and the other to be centered in the middle to help "organize" the web page's content.

Here's the main part: http://dl.dropbox.com/u/3349370/nearest.gif
And the plain gray: http://dl.dropbox.com/u/3349370/farthest.jpg

Basically I just want to combine the two images with "nearest.gif" on top.
This is how I would like it:
http://dl.dropbox.com/u/3349370/pic001.jpg

Any suggestions?

zen-angel
06-21-2011, 09:36 PM
use a background-color in place of the grey image:


background-color:#423f28

ndm250
06-21-2011, 11:42 PM
use a background-color in place of the grey image:


background-color:#423f28

Then how do I use the "nearest" image as the background for the all the content?

zen-angel
06-22-2011, 07:00 PM
Then how do I use the "nearest" image as the background for the all the content?

you apply it as css background to a certain element of your page.. which one depends on your HTML....

mpresley
06-22-2011, 07:31 PM
I would create a background wrapper in css that has the image you are talking about as the background image and a z-index:1;

Then I would create another div for content. On that div I would do a thin slice of the background image you want and tell it to repeat. So, it can grow with content. If not needed and size doesnt matter then just go ahead and set the second image as the background element for that div with a z-index:15;

Thats what I would do, but that all depends how you are marking it up.

Matt

zen-angel
06-22-2011, 07:38 PM
1. z-index works only for positioned elements
2. why do u insist in using a solid color image as background when you can use css to set a color?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum