2023 2024 Student Forum > Management Forum > Main Forum

 
  #2  
11th February 2013, 01:53 PM
Super Moderator
 
Join Date: May 2012
Re: CSS Word Wrap around Image

CSS Word Wrap around Image Floating is often used to push an image to one side or another, while having the text of a paragraph wrap around it

Float Image
CSS Code:
img.floatLeft {
float: left;
margin: 4px;
}
img.floatRight {
float: right;
margin: 4px;
}

HTML Code:
<body>
<img src="sunset.gif" class="floatLeft">
<p>The images are contained with...</p>

<img src="sunset.gif" class="floatRight">
<p>This second paragraph has an...</p>
</body>

Floating Multiple Images
CSS Code:
img.floatRightClear {
float: right;
clear: right;
margin: 4px;
}

HTML Code:
<body>
<img src="sunset.gif" class="floatRightClear">
<img src="sunset.gif" class="floatRightClear">
<p>The images are appearing...</p>
<p>If we had specified...</p>
<p>The number of paragraphs...</p>
</body>


Quick Reply
Your Username: Click here to log in

Message:
Options




All times are GMT +5. The time now is 10:08 AM.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, vBulletin Solutions Inc.
SEO by vBSEO 3.6.0 PL2

1 2 3 4