Bring background-image to frontground. Possible or not?

I really need to get the background picture in front of another picture and I can't find a way to do it without using absolute positioning.

<di开发者_JAVA百科v><?php get_avatar($x, 56); ?></div>

get_avatar displays an image. So the HTML looks like:

<div><img src="whatever"></div>

A little help anyone?

you can use css multiple background property

check this http://www.css3.info/preview/multiple-backgrounds/

or

Edit:

you can give your another pic z-index in minus like this:

    div{
    background:yellow;
    position:relative;
}
img{
    position:relative;
    z-index:-1
}

<div>
 <img alt="" src="http://dummyimage.com/200x200/000/45454&text=images">
</div>

check the example http://jsfiddle.net/sandeep/5vpG7/

You can use the css z-index property.

Set z-index:999;

Your code (with a background image style added for clarity):

<div style='background-image:url(something.jpg);'><img src="whatever.jpg"></div>

In order to make the background image show instead of the foreground image, the easiest solution is simply to make the <img> invisible.

Two ways to do this using CSS:

1. Set it to visibility:hidden;

2. Set it to opacity:1;

The first solution is the best, as it will work in all browsers.

Changing the opacity via Javascript would have the benefit of allowing you to do a fade effect, but expect problems with IE if you do that.

Hope that helps.