When developing a web gallery, it can be usefull to maximize the image to the screen, so that

  • the proportions are preserved
  • the whole image fits the screen.

Here is a method for that, in pure HTML & CSS.

<style>
#imagewell {
    position: absolute;
    top:0;left:0;bottom:0;right:0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
</style>
<div id="imagewell" style="background-image: url('http://upload.wikimedia.org/wikipedia/commons/thumb/0/0f/Grosser_Panda.JPG/300px-Grosser_Panda.JPG');">
</div>