So, basically it is a two step process. But, once you get the CSS code placed in the CSS style sheet, you only have to tell the image where to go from then on when posting images. If you notice, I have my flowers to the left and the gingerbread boys to the right, and the text wraps around them.
Here are the steps.
Step 1: Locate the CSS style sheet and paste this code (I put mine under the post section):
/*Wrap text around imageStep 2:This is what your image tag will be similar to:
----------------------------------------------- */
.left {
float: left;
margin: 6px;
}
.right {
float: right;
margin: 6px;
}
<img src="http://farm4.static.flickr.com/3599/3515377006_db67e698de_m.jpg" />Add class="left" or class="right" to that image tag. It will look like this:
<img src="http://farm4.static.flickr.com/3599/3515377006_db67e698de_m.jpg" class="right" />Since I added class="right" to that image tag, the image will float to the right and the text will wrap on the left.
One more thing. When using this method to post an image, you will have to use the Edit HTML tab in the posting window...not the Compose tab.
EDIT: Thanks to an email from David Cosier/Fear Healing, I discovered a potential error in this code...it has been corrected. I left out the ----------------------------------------------- */ part of /*Wrap text around image. It really matters!
No comments:
Post a Comment