How to start text below an image?

[Ikke]

Hi everybody,

This is probably a very simple question, but after a long time of trying
I'm afraid I still have not found a solution.

Have a look at the following page:
http://users.pandora.be/esreverian/test/image.html - it contains an image,
and has three <p>'s of text next to it.

How can I force paragraph three to start below the image? A break does not
work.

I can add paragraphs until it reaches below the image, but:
1) that feels like cheating
2) is flawed when the text changes
3) is probably not only the dumb way, but harder then the real way :)

Could anybody please tell me how to do this?

Thanks in advance!

Ikke

[Beauregard T. Shagnasty]

Ikke wrote:

This is probably a very simple question, but after a long time of
trying I'm afraid I still have not found a solution.

Have a look at the following page:
http://users.pandora.be/esreverian/test/image.html - it contains an
image, and has three <p>'s of text next to it.

How can I force paragraph three to start below the image? A break
does not work.

CSS:
..imgleft {
background-color: transparent;
color: #708090;
font-size: 90%;
padding: 1em;
text-align: center;
}

HTML:
<p <!-- image inside first paragraph -->
<span class="imgleft">
<img src="../images/yourimage.jpg" alt="..." title="..." width="100"
height="100">
<br>Caption if desired
</span>
1. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</p>
<p>
2. Etiam luctus suscipit ipsum. Nam tellus eros, consectetuer a,
vulputate quis, condimentum nec, augue. ...
</p>
<p style="clear:both;>
3. Nullam nonummy arcu in nisi. Integer vitae turpis. Nam ...
but why would you want to disrupt the flow and force this one below the
image? Personally, I would leave out the 'clear:both;'
</p>

Though if you really want those leading numbers, why don't you use a
list?

--
-bts
-Motorcycles defy gravity; cars just suck.

[Ikke]

"Beauregard T. Shagnasty" <a.*********@example.invalidwrote in
news:2h*********************@bgtnsc04-news.ops.worldnet.att.net:

<snipped>

Thank you very much - it works like a charm!

Though if you really want those leading numbers, why don't you use a
list?

Those numbers were there just for the sake of identifying the paragraphs,
the contents of the div would just be text. It would be a lot better to use
a list, if the numbers would be left in.

Thanks again,

Ikke

[Beauregard T. Shagnasty]

Ikke wrote:

"Beauregard T. Shagnasty" <a.*********@example.invalidwrote:

><snipped>

Thank you very much - it works like a charm!

In my haste to cut'n'paste, I missed some lines:

..imgleft {
float: left;
}
..imgright {
float: right;
}

Sorry about that. <g I use this method all the time in my sites.

>Though if you really want those leading numbers, why don't you use a
list?

Those numbers were there just for the sake of identifying the
paragraphs, the contents of the div would just be text. It would be a
lot better to use a list, if the numbers would be left in.

Oh, ok. :-)

--
-bts
-Motorcycles defy gravity; cars just suck.