Меняем размер с сохранением пропорций

Старая-старая задачка: нужно разместить на странице картинки, сохраняя пропорции, но размеры картинок заранее неизвестны.
Самое простое решение - установить размер для одной из сторон! Простой и эффективный ход. Одно но: работает только если у картинок примерно одинаковые пропорции. Итак пример:



-у нас есть контейнер 200х300
-ограничиваем ширину картинки в 200px
-центруем по горизонтали и вертикали

вставляем картинку 800х600 - результат нормальный, 800х1000 - еще лучше! И тут мы вплотную приблизились к очень болючим граблям: 200х800 - результат кошмарный.

Я доволно долго пробовал разные способы, единственное кроссбраузерное решение, которое я нашел - javascript. Все доволно просто:
1) Назначаем контейнеру overflow: hidden (это для того, чтобы большая картинка не заслоняла весь экран во время загрузки)
2) На onLoad картинки вешаем функцию из пункта три: onLoad="check_img(this)"
3) Закидываем на страницу функцию:

var MaxWidth = 150;
var MaxHeight = 170;

function check_img(img){
    setTimeout(function(){
    if (img.height <= MaxHeight && img.width <= MaxWidth) return;
    if (img.width/(img.height/MaxHeight) > MaxWidth){
        img.height = Math.round(img.height/(img.width/MaxWidth));
        img.width = MaxWidth;
    } else {
        img.width = Math.round(img.width/(img.height/MaxHeight));
        img.height = MaxHeight;
    }
}, 15);
}

Таймаут в функции изменения размеров картинки нужен. Просто нужен, без него иногда картинка остается непотребного размера.

Спасибо за внимание, всем удачного изменения размеров картинок с сохранением пропорций!