Img/p alignment and wrapping - possible?

[ChocolateLover]

HTML - preferable (image is outside of p tag)

<p>Monocrystalline, polycrystalline and amorphous solar panels with without frames, for 12V battery charging.</p><img src="images/thumbs/rigid panel mini.jpg" width="62" height="62" alt="Rigid solar panels" />
HTML - acceptable (image is within p tag)

<p>Monocrystalline, polycrystalline and amorphous solar panels with without frames, for 12V battery charging.<img src="images/thumbs/rigid panel mini.jpg" width="62" height="62" alt="Rigid solar panels" /></p>

I would like the image aligned right and the text to wrap around it.

If I reverse the HTML and have the <img> before the <p> I can achieve the look I want with the following CSS.


img {
margin:0;
padding:0 0 0px 5px;
vertical-align:text-top;
float:right;
}

I'd prefer the text to come before the image in the HTML if possible.

Any help gratefully received, thanks.

[bluewalrus]

link available?

[jscheuer1]

Put the image in the paragraph, but put it before the text.

[BLiZZaRD]

<div>
<p>
Monocrystalline, polycrystalline and amorphous solar panels with without frames, for 12V battery charging.
<img src="images/thumbs/rigid panel mini.jpg" width="62" height="62" alt="Rigid solar panels" align="right">
</p>
</div>


Add a container div to hold them, align the image left or right, the text will wrap itself.