Z-index et empillement d'élément.

Bonjour cher communauté de CCM,
J'ai un soucis qui peut paraitre rikiki mais qui me pose un sacré problème en ce moment.
Je cherche un moyen de développer une petite boite flottante sur des images de profiles lors d'un passage de souris dessus.
La condition : Que la boite flottante n'empiète pas sur l'élément sélectionné mais apparaisse devant les autres.
Un petit schéma pour illustrer mes propos qui peuvent ne pas être très clair :



mon code est de la forme suivante :
HTML

 <a href="" class="profil">
<span class="boite-flottante">John Doe</span>
 <img src="..." alt="...">
</a> 

J'ai tenter le z-index mais son fonctionnement à ses particularités qui ne me permettent pas de manoeuvré comme je le veux.

Merci d'avance !