roytang.net Posts Photos Archives About
Roy Tang said...

My solution was to provide a container div that would bound the object to the needed size:

#img_container {
  width: 48%;
  height: 80%;
}

Then for the image, itself I assigned max-width and max-height which are recognized by firefox:

#img_container img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

This way, the image auto-adjusts itself at most to the width of the container, but keeps the correct aspect ratio. Hooray!

via stackoverflow.com