Posted by Steve Pugh on 12/06/05 18:13

David wrote:
> I'm having a very difficult time accomplishing what I want. I want to
> place graphics next to a list item, and have the next list item start below
> the bottom of both the list item text and the graphic. (In other words,
> the top of the list item should be below whichever one takes more space.)
>
> Here is a page showing the difficulty:
>
> http://www.randommonkeyworks.com/work/test.html


Get rid of the DIVs. Float the images themselves. Then clear the list
items and the first element after the list.

(N.B. it's clear: both in CSS not clear: all)

e.g.

<ol>
<li style="clear: right;"><img src="shape.jpg" width="184"
height="175" border="0" alt="" style="float:right;">Here's an
example.</li>
<li style="clear: right;"><img src="shape.jpg" width="184"
height="175" border="0" alt="" style="float:right;"></div>I want the
top of this list item to start at the bottom of the first graphic.</li>
</ol>
<p style="clear: right;">I'd also like this paragraph to start below
bottom of the second picture. IE actually comes closer to doing what I
want, but it places this paragraph to the left of the second picture,
not below it. FF is horrible, as it places both pics next to each other
(horizontally). Grrrr.</p>

Steve

[Back to original message]