Reihenfolge der Z-Index-Elemente auf bxslider

Ich muss den Inhalt eines bxslider mit einem No-Child-Element bestellen. zwischen dem Bild und dem Text oben.

z.B

<div>
<ul id="slider">
<li><img src="image1.jpg" /><span>text</span></li>
</ul>
<div class="under-text-over-image"></div>
</div>

Kann mir jemand einen Rat zum Z-Index geben?

Mein bestehendes CSS ähnelt:

li img{
position:relative;
z-index:1;
}
li span{
position:relative;
z-index:3;
}
.under-text-over-image{
position:relative;
z-index:2;
}

Vielen Dank

Antworten auf die Frage(3)

Ihre Antwort auf die Frage