wrapping text around image in html

DrRakha

Following example shows you the benefits of using the float attribute to wrap the text content around an image.

Code:

<html>
<head>
  
  <title>Wrapping text around an image</title>
  <style type="text/css">
  img.floatImage { 
    float: left;
    margin-right: 2px;
    margin-bottom: 1px;
  }
  
  img.nofloatImage { 
 
    margin-right: 2px;
    margin-bottom: 1px;
  }
  </style>
</head>

<body>
    <center>
     <b> This example shows you the difference when using the float attribute with your image. 
      Using this attribute allow you to wrap the text around the image.
      </b>
    </center>
  <p>
  <img src="site_logo.gif"   class="floatImage" alt="image" /> 
  
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
     
  
   
  </p>

  <p>
  <img src="site_logo.gif"   class="nofloatImage" alt="image" /> 
  
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
    your content here. your content here. your content here. your content here.
     
  
   
  </p>
  
  
</body>
</html>

 

Java

C/C++

PHP

C#

HTML

CSS

ASP

Javascript

JQuery

AJAX

XSD

Python

Matlab

R Scripts

Weka

wrapping text around image in html

Topic Tags