Open top menu
23 February 2012

Yet another post inspired by a conversation on Twitter. It seems some themes stretch the dimensions of an image making it look out of proportion. So I've devised a solution. This fix will make sure all your post images are the same width so it can also improve the look of your blog. It automatically works out the height so don't worry, you won't end up with images that look distorted. It retains the original images proportions.

To apply this fix. Navigate to Dashboard>Template>Customise>Advanced>Add CSS.

Copy the following code and place it in the box.
 
 
.post-body img {
width: 400px;
height: auto;
}
 
.post table.tr-caption-container img {
width: 400px;
height: auto;
}

Replace 400 with the desired default width you'd like for your photos. Then press the 'apply to blog' button and all your images will change to the desired size. Easy peasy! If you have any problems just comment, tweet me or drop me an email!
Tagged
Different Themes
Written by Templateify

Aenean quis feugiat elit. Quisque ultricies sollicitudin ante ut venenatis. Nulla dapibus placerat faucibus. Aenean quis leo non neque ultrices scelerisque. Nullam nec vulputate velit. Etiam fermentum turpis at magna tristique interdum.

4 comments:

  1. MsDriftedSWFebruary 23, 2012 at 2:00 AM

    doesnt necessarily work for those images in tables. gave me a massive headache cuz those in tables are within a class (tables get an automated class and tables are automatically created when you click on 'add caption' on them)

    ReplyDelete
  2. adminFebruary 23, 2012 at 2:07 AM

    it should work for the majority though as most people don't use tables :)

    ReplyDelete
  3. SarirahFebruary 23, 2012 at 6:20 PM

    Thank you for this. It worked nicely and I feel that my blog posts look a lot neater now. :)

    ReplyDelete
  4. BrookeMarch 10, 2012 at 3:56 AM

    Pardon the stupid question here but will this change past posts or only the future ones? Also, since I have you here, one more little (and stupid) question, what is 400px equal to? And do you suggest a size for pictures?

    ReplyDelete

Subscribe to: Post Comments (Atom)