Images & Text

I was wondering if you look at the following example how he has his picture on top of an image with some text around it. Now I imagine that the main image is a background image and his picture and text are formatted somehow so that it appears how it does.

http://shiflett.org/

Now I have fiddled around in many ways but canít get it to render exactly how he has done on his website.

This is what I have so far

CSS

Code:
.biography
{
background-image:url(images/picture.gif); 
width: 175px; 
height: 140px;
}

.biographyimage
{
width: 80px;
height: 100px;
}
HTML

Code:
<div class="biography">

<p class="pmenu"><img src="images/simonjohnstone.gif" class="biographyimage" />Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p>
</div>

How do I get it so that I can render the words and biographyimage like on the website.


Cheers for any advice