Insertar texto sobre imagen

[tak74786]

Estoy intentanto insertar un taxto sobre una imagen para q quede algo asi como se muestra en las fotos de http://www.abc.es/ sale la imagen y una descripcion al pie si lo inspeccionan con firebug veran q es un div q esta en la imagen y el texto es como si fuera de la imagen pero no le encuentro como posicionarla como lo hacen ellos tengo mi codigo asi:

Código HTML:

<a href="link" rel="bookmark">
        <img src="dir_imagen" >
            <div id="sombra">
                <div id="teximg">
                    TEXTO
                </div>
            </div>
        </img>
    </a>
 

Código CSS:

#sombra{ 
    color:#FFF;
    width:auto;
    background:none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
    position: relative;
    top:0px;
    left:0;
    min-height: 15px;
    padding: 5px 0;
    position: relative;
    z-index: 1;
}
 
#teximg{
    float:none;
    display: inline;
    float: left ;
    font-size: 12px;
    font-weight: normal ;
    margin: 0;
    padding: 0 10px;
    text-align: left;
}
 

es mas o menos lo q veo que hacen en la paginas antes nombrada pero no me funciona el texto me sale debajo de la imagen y no es paarte de la imagen.
Gracias por su colaboracion