Question

Supposing I’m setting a background image for a web page in CSS like this:

body    { font-size: 62.5%; /* Resets 1em to 10px */ font-family: Verdana, Arial, Sans-Serif; background-color: #9D5922; color: #000; margin-left: auto; margin-right: auto; margin: 0; padding: 0;  background: url(images/desk.gif) repeat bottom left; } 

Is there any way to layer a second image on top of the desk.gif within the body element itself, or is the only way to create a separate class and use the z axis?

Sorry, it’s a simpleminded question, but I’ve been trying to figure this out and though I haven’t been able to make it work, I also haven’t found a clear slapdown of the idea anywhere online… so, is there a way, or is this just a no can do?

Thanks!

Answer 1

In short, it’s not possible. You can do this, but you need to add a second HTML object to the page to get it to work. So for example, place a div block right below your body, and assign the second background to that object.

Hope this helps!