Align Images in your Blog posts

If you find aligning images in your blog posts difficult and you can’t line up your text along side smaller logos or images, you should continue reading.

I will start the post with examples of poorly aligned and nicely aligned images in blog posts.

The following screenshot displays a poorly aligned image in a blog post.

See how the image wastes precious spaces by not allowing the text to align with the image. Now we observe a nicely aligned image in a blog post.

See the difference it creates? Plus it adds more to visual appeal of your blog. How to achieve this? Well its a simple edit in your theme’s stylesheet file.

NOTE: Make a backup of your theme’s style.css file before this incase some problem occur you can always revert back to old one.

Open your theme’s style.css file and add the following line at bottom of your css file:

img.right {
float: right;
margin:10px 0 0 10px;
}
img.left {
float: left;
margin:0 10px 10px 0;
}

Now whenever you want to post a small image which you want aligned with text in a post just add class=”right” or class=”left” in <img> tag while writing the post.This code should work on allmost all themes. Worked on this blog’s too.