I've been building a simple image library for a content management system and part of it requires the listing of images with thumbnails displayed. The image dimensions are highly variable, and so I needed to some way to display the image at its natural size and aspect ratio, but to limit both dimensions so large images couldn't upset the way the list appears.
I used this style setting at the top of my page, imposing the limits on all <img> elements. Naturally this could be made more specific, but this suited me fine.
img {
max-width: 100px;
max-height: 100px;
/* Resize the image for IE6 */
width: expression(this.width > 100 ? 100: true);
height: expression(this.height > 100 ? 100: true);
}
No comments:
Post a Comment
Comments are moderated, so you'll have to wait a little bit before they appear!