Same width for all Blogger images

If you are a blogger, you'd definitely take efforts for you blog to make look nicer. I've been looking for various ways for formatting my images on my blog and honestly until now I've been doing them manually for each image. So every time I change the width of the blog or change the template, the images all go may-hem and looks ugly.

On one of my recent "hunts" for formatting blog images, I found this code. And what this does is format all the images to a fixed width. The height automatically adjusts, so yay! 

So, this is what you need to do. 
This works on Blogger as of 1/16/2013. 

Go to Template, and click Customize.
Then go to Advanced and then click Custom CSS.
Copy and paste this code. Then click on Apply to Blog

.post-body img {
width: 400px;
height: auto;
}
.post table.tr-caption-container img {
width: 400px;
height: auto;
}

You can change the 400px to any value you want.

I forgot to bookmark the site from where I got this code, so if the origin site owner comes across this page, please do contact me, will be pleased to give you credit.  

6 comments:

  1. Thanks for this! exactly what I needed. :)

    ReplyDelete
  2. what if i already have custom html for my blog?? where do i paste it in while i'm in customize? there's already so many codes in there!

    ReplyDelete
    Replies
    1. You can post it anywhere in the Custom CSS. Just make sure you aren't posting in the middle of some existing code. Beginning or at the end are the easiest to put it at.

      Delete
  3. Really great post! Have search for this for a long time.

    Thanks,
    www.coraliee.blogspot.com

    ReplyDelete
  4. Thank you very much! I used this code before, however, I want to put social buttons on the end of my blog post, since those are images, they strech and look weird, ruining the aesthetic of my blog post. Is the an HTML code just for the photos I take, that I can open and then close on each post (for more than 1 picture I mean) that would make all my pictures the same width but not affect other images like social media icons?}

    http://alinaalamode.blogspot.com/

    ReplyDelete

Let us know if this post helped you.
Comments may be moderated, and may not appear immediately.

Share this...