banner
inicio mail me! sindicaci;ón

How Do You Do That? Wrapping Text Around Images

Sure it’s nice to just share your images but sometimes you want to do something special. The following tutorial will show you how to wrap text around an image.

<img src="http://thelocationofyourimage.jpg" align="left" hspace="3" vpsace="3" >

The above code will place your image to the left with a 3px border around it. The “left” can be changed to right as well. You can also increase the hspace and vspace numbers to give you the amount of space you desire.

If you’re not interested in doing this each and every time you wish to wrap text around an image, the same thing can be accomplished with just a smidge of css.

img.left {margin: 3px 3px 3px 3px; padding: 3px; display: inline;}
.left { float: left; }

What the above does is make sure that your text and image are lined up properly as well as placing a margin of 3px around the entire image and also padding the image with 3px.

By placing the above into your stylesheet, you simply have to do the following to make the whole thing work.

<img src="http://thelocationofyourimage.jpg" class="left">.

Easy.

Leave a Comment