css - Transparent button on top of images -

i want create transparent button on top of images.

like this

my css skills hit limit here. how do css? should work on browsers.

lets have div container there inside image tag , underneath button tag.

<div id="box"> <img....> <div class="overlaybutton"><a href=...." class="button"><font color="#ffffff">profile blabla</font></a></div> </div>

this should minimum code should provide assume. handle problem: need change position of box img , overlaybutton in css code. this:

.box img {   position: absolute; .. .. }  .box .overlaybutton {   position: absolute;   opacity:0.5;  //to make transparent }

the rest should self explained. hope helped you.

M16