Float your pics

Sometimes the things that appear to be the simplest in the world are often those that turn out to be the most difficult.

A case in point is the image aligned to the right hand side of left aligned text. Trying to achieve this effect can be frustrating and difficult to achieve with even up to date HTML editors. So what’s the trick?

In most cases, by taking a peek at the underlying source code you will find that the image has been floated into position rather than placed. An image, a divider or even the main body of your web page, for that matter, can be floated on top of an existing page element.

So how do you create a floater?

Try this snippet of code:

<img src="yourimage.jpg" alt="Your image alt text here" style="float:right;"><p> Place your accompanying text here. </p>

Replace yourimage.jpg with the path to the image you are going to use. Likewise the alt text and the text between the paragraph tags. It’s really that simple.