<img> по размерам элемента <div> c пропорциями

Как сделать, так чтобы браузер уменьшал размеры картинки <img> по размерам элемента <div> - при этом сохранялись все пропорции размеров картинки, т.е.

Код (Text):

1.  
2. <div style="width: 450px;">
3. <img src="post13.gif">
4. </div>

 

Да это конечно помогает когда картинка больше, но когда она меньше - то браузер вместо того чтобы оставить ее в покое, увеличивает на все эти 100% (450px) - получается лажа!

Хотелось бы чтобы та графика, которая не проходит по размерам div'а уменьшалась (пропорционально!!!), а остальная не изменяла своих исходных размеров!

 

Нашел решение вида:

HTML:

1. <div>
2. <img src="post13.gif" style="max-width: 450px;" />
3. </div>

Однако IE глухо игнорирует и просто обрезает по ширине графику - что не есть хорошо, в Opere все путем!
Мож у кого есть мысли - как сделать так чтобы и в Opera и в IE одинаково было?

 

ВСЕ!!! ТЕМУ МОЖНО ЗАКРЫВАТЬ!
Тока что нашел решение проблемы
может кому понадобиться - вот:

Содержание CSS:

[css].images-post {
overflow: hidden;
padding-left: 20px;
padding-bottom: 10px;
width: 500px;
}

.images-post img {
max-width: 500px;
width:expression(this.width > 500 ? "500px" : this.width);
}[/css]


непосредственно HTML:

HTML:

1. <div class="images-post">
2. <a href="firefox-gray.jpg">
3. <img src="firefox-gray.jpg"></a>
4. </div>

Все это было нужно для того, чтобы посетители моего блога могли прикреплять картинки к постам! А решение проблемы - позволило избежать всяких гадостей происходивших с дизайном блога - когда посетитель добавлял картинку шириной более 500 px - теперь картинки отображаются как надо (не более 500 px в ширину) - не ломая дизайн сайта - а для того чтобы увидеть полный вариант картинки - стоит просто щелкнуть по ней мышью! - КАК РАЗ ТО ЧТО БЫЛО НУЖНО!

 

а как же он ее запостит сударь? а?
upload_max_filesize - это раз! а $_FILES['name']['size'] - это два!

 

да брось - у меня хостинг-площадка на 250 Mb! да и вообще нафига это кому надо