Floating image in text problem

[ErikTheSick]

Hi everyone

I'm stuck with a little problem. I like to have floating images in my text like here:
http://www.meijer.li/php/biking/wildspitz.php
But I would like to start a new title on a below the image and it's description which are floating to right side. Any idea how i can do this without using tables?

Thanks and cheers
/erik

[TJ111]

It's not hard, just wrap the image and anything you want associated with it in a div.

div.image {
width:20%;
float:left;
text-align:center;
}
div.image p {
text-decoration:italic;
}

then in your html

<h2>Overview</h2>

<div class="image">
<img src="/path/to/image.jpg">
<p>Image Description</p>
</div>

<p>This text will wrap around the image and its
description, if it's long enough.</p>

[ErikTheSick]

Thanks for your reply mate, but that is what I already have. So text is wrapping properly around the image if it is big enough.
The problem is, if it is not big enough, the title of the next paragraph wraps also around the image, an I like to prevent that.
I hope I made myself clear now...

[TJ111]

Oh, I see what you mean. You can do either of the following to prevent that:

<h2 style="clear:left">

Or better

.clearL {
clear:left;
}


<h2 class="clearL">

//this way you can prevent from having to write multiple inline styles throughout your source.

[ErikTheSick]

yes, thats right what I was looking for.
thanks a lot mate!