Total members 11777 |It is currently Sat May 18, 2019 4:11 pm Login / Join Codemiles

Java

C/C++

PHP

C#

HTML

CSS

ASP

Javascript

JQuery

AJAX

XSD

Python

Matlab

R Scripts

Weka





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 
    
floatleft;
    
margin-right2px;
    
margin-bottom1px;
  }
  
  
img.nofloatImage 
 
    
margin-right2px;
    
margin-bottom1px;
  }
  </
style>
</
head>

<
body>
    <
center>
     <
bThis 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 hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
    
your content hereyour content hereyour content hereyour content here.
     
  
   
  </
p>

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

 





Author:
Mastermind
User avatar Posts: 2707
Have thanks: 74 time
Post new topic Reply to topic  [ 1 post ] 

  Related Posts  to : wrapping text around image in html
 how to change the alignment text in html     -  
 convert image (vehicle registration) to text in java?     -  
 Able to Copy Text from Uneditable Text Boxes(JTextfields)     -  
 Image-Viewer-Image Processing-Filters-Noise-enhancements     -  
 Java- Copy text area into disabled text area     -  
 Move image in front of a background image     -  
 different between cfa image and gray level image     -  
 PNG image to the image you generated     -  
 text like a curve     -  
 Aligning the text within the div tag     -  



Topic Tags

HTML Image






Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
All copyrights reserved to codemiles.com 2007-2011
mileX v1.0 designed by codemiles team
Codemiles.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com