how to resize images in your blogger post ?

By nhamngahanh | posted: 00:51 | 2 comments
helpful tip
 In your post ,if image's size larger than layout ,it will be overfloat ,and break the design of your blog .
To fix this problem ,we can set a maximum size for images in your post  .If image size larger than this value ,image will be resize automatically ,but still keep proportion .


How to do it ?

Just as this code in style section of your template . Find the line <b:skin><![CDATA[/* and insert this code right after :

img {
max-width: 480px;
width: expression(this.width > 480 ? 480: true);
border: none;
text-align: center;
}

in the code above ,480 is the maximum width of images . Set this value depend on your need .
You can change width to height to set the max-height of images .

Guest Blogger

This post was written by a guest contributor. Please see their details in the post above. If you'd like to guest post for SimplexDesign check out our Write for us page for details about how YOU can share your tips with our community.

Share this post

Related Posts

Advertisement

2 comments

  1. Goals temple22 September 2009 at 20:45

    how to do it this for videos,bacause i dont have photos just videos any guess?

    ReplyDelete
  2. nhamngahanh23 September 2009 at 06:31

    if you insert videos in your blog ,you have to use embed tag . So you just need to use this css code :

    embed {
    max-width: 480px;
    width: expression(this.width > 480 ? 480: true);
    }

    just change the width for your website .They are attributes for embed tags .

    ReplyDelete