View Full Version : wrapped text around an image


Ambar
07-05-2010, 06:06 AM
Hi !, I was reading about reflow text around a non-rectangular image from Jellby and Zelda_pinwheel, Thanks a lot guys ! But I'm not able to do this, not yet. Maybe I need to start with a easy way, just wrapped text around an image.
Can someone help me ?? Thanks !

charleski
07-05-2010, 07:17 AM
Well, it starts off very simple. If you want an image on the left side of the page with text floating around it on the right, use this:

[CSS]
div.leftpic {
float: left;
clear: left;
text-align: left;
}

[XHTML]
<div class="leftpic"><img ..... /></div>
<p>Your text here</p>

To have the image float to the right, just change 'left' to 'right' in the css.

It gets tricky when you want to fine-tune the margins, a lot of the extra code in Zelda's 'Three Men in a Boat' is written to do that.

Ambar
07-05-2010, 08:55 AM
Thanks a lot for your help!