Hi Guys

I have I pic in a div that I want on the left, and on the right of the pic I want a short piece of text if possible vertically centered by the pic.

I have set up a class and tried the following html and css to no avail. The text shows on Firefox under the pic. Any suggestions please ?

css

.photoleft {float: left; padding:2px 0px 8px 10px; margin: 0; width: 100px;}

html

<p class="photoleft"><img src="images/picture.jpf" width="100" height="125" ><br>short text</p>

Thanks in advance

The text is within the floated element. You must remove the text from the floated image. Just float the "IMAGE" left and a paragraph will wrap around it (provided you have everything else right in the CSS etc.)

What he said.

Take out the line break, too. Think of <br /> like a hard return, because that's what it is. Don't forget to clear the float after you words you want to wrap around it (Check the stickies in this forum for how to do that).

So what you'll have is something like:

<div>
<img class="photoleft" src="images/picture.jpg" width="100" height="125" alt="description" />
<p>short text</p>
</div>
<br class="brclear" />

(in the css .brclear{clear:both; margin:0; padding:0; line-height:0;}

tim

Or, to clear the float just as overflow to the div holding the floated image - no extra markup required

Thanks guys
I did what racer said and it worked.
(I need to study floats more and /br)