CSS show div background image on top of other contained elements

Not sure if this is possible and how, but I tried playing around with the z-index of the elements in my code with no success. I have a div element that has a background image set in css. inside the div, i have other elements, like div and img. I am trying to have the main div that contains the background image stay on top, since I want that background image to show on top of the other elements (this background image has some rounded corners that I want to show on top of the image included in this div). Example HTML: ``` <div id="mainWrapperDivWithBGImage"> <div id="anotherDiv"> <!-- show this img behind the background image of the #mainWrapperDivWithBGImage div --> <img src="myLargeImage.jpg" /> </div> </div> ``` Example CSS: ``` /* How can I make the bg image of this div show on top of other elements contained Is this even possible? */ #mainWrapperDivWithBGImage { background: url("myImageWithRoundedCorners.jpg") no-repeat scroll 0 0 transparent; height: 248px; margin: 0; overflow: hidden; padding: 3px 0 0 3px; width: 996px; } ```