lucy24 - 6:33 am on Mar 19, 2012 (gmt 0)

It would be a heck of a lot easier if you could persuade yourself to put a paragraph break where the image is to go.

My eyes glazed over at all that code. Did you try defining a floated span with width = 100% and plopping the image into that?

This worked in six out of six browsers, including-- incredibly-- my prehistoric version of MSIE* for Mac that I've only lately discovered will still run. The image is a 300x300 box made for testing purposes. Didn't try it in a proper document with DTD and all the fixins, just typed in some blahblah and saved with html extension. I hope this is not one of those cases where doing it right makes the thing not work ;)


<div style = "margin: 2em;">
<p>blah blah blah blah blah {add a bunch more text here}
<span style = "float: right; padding: 1em 0; margin: 0; width: 100%; text-align: center;">
<img src = "picture.png" width = "300" height = "300" alt = "box">
</span>
blah blah blah {and more here}</p>
</div>


* Well, sort of. It started the span at-- I assume-- the exact point I declared it, instead of going to the end of the line of blahblah before breaking for the image.