imagen sobre otra imagen con css?

[oscarza]

css

Código:

#derecha2 {
	position:absolute;
	top:0px; /*en función de los tamaños de "derecha" */
	left:0px; /*en función de los tamaños de "derecha" */
	opacity: .7;/*esto es una frivolidad*/
	background-image:url(featu.png);
	background-repeat:no-repeat;
	width:383px;
	height:246px;
	z-index:31;
}

html

Código:

<div id="derecha">
                  <img src="images/featuredimages/featuredImage.png" alt="rotador"/>
                  <img src="images/featuredimages/featuredImage2.png" alt="rotador"/>
    			  <img src="images/featuredimages/featuredImage3.png" alt="rotador"/>
                  <img src="images/featuredimages/featuredImage4.png" alt="rotador"/>
                  <img src="images/featuredimages/featuredImage5.png" alt="rotador"/>
                  <img src="images/featuredimages/featuredImage6.png" alt="rotador"/>
                  <div id="derecha2">
                  </div>
                  </div>

Esto fue lo que hice, en el dreamweaver ya se muestra el div(derecha2)bien colocado, pero en el navegador no muestra la imagen de fondo que le puse (featu.png)