title: Fit an image proportionally inside a div - image should never be clipped
body: <p>i've read a bunch of posts on fitting an image inside a div, but none solved my problem yet:</p>
  
  <p>I have a responsive webdesign that sets the height of the container div to the browser window height, and then loads images into a flexslider. Most of the images will be larger than the browser viewport.</p>
  
  <p>My problem is that I can make the photos fit the width correctly, but images never adjust the height properly. See <a href="http://stineheilmann.dk/portfolio/shoes/" rel="nofollow">http://stineheilmann.dk/portfolio/shoes/</a> (picture no. 3)</p>
  
  <p>How do I ensure that the picture always stays inside the containing div, while maintaining the aspect ratio?</p>