The CSS float property is very important property for layout. First, you have to understand how it works then only can position your web page designs exactly as you want them to display.

A CSS float property looks like this:

.right {float: right;}

Step by Step: Floating an Image to the Right

Step 1: Start with a paragraph of text and an image

For example, your paragraph will look like this:

<p>As jy soek na gratis PowerPoint templates het, het jy op die regte plek. Ons het ‘n groot versameling van agtergronde, voorlegte, en meer inspirerende free stuff pragtige presentaties op te bou. Alle temas ontwerp is gratis om af te laai en ook 2 of meer skyfies gereed-vir-gebruik. Aflaai, pak en neem die volle beheer oor jou PowerPoint voorleggings.</p>

Step 2: Apply float: right to the image

If you want your image to be displayed to the right side of your paragraph, then “float: right” is applied. In this case, the name of the class is “.right” but you can try to use other name as well.

<style type=”text/css”>

.right

{

float: right;

}

</style>

<p><img class=”right” src=”rect.png” width=”100″ height=”100″>As jy soek na gratis PowerPoint templates het, het jy op die regte plek. Ons het ‘n groot versameling van agtergronde, voorlegte, en meer inspirerende free stuff pragtige presentaties op te bou. Alle temas ontwerp is gratis om af te laai en ook 2 of meer skyfies gereed-vir-gebruik. Aflaai, pak en neem die volle beheer oor jou PowerPoint voorleggings.<p>