Как подогнать картинку под определенный размер

[alleclf]

Как можно подогнать картинку под определенный размер блока (див или таблицы неважно). Что бы картинка как-бы вписалась в выделенную область с сохранением пропорций.

Подробнее: есть область 100х100, и картинки 150х50 и 50х150. Если в ксс указать только ширину картинки, первая картинка (150х50) ужмется как надо, а вот вторая (50х150) вылезет снизу. Если указать высоту, вторая (50х150) красиво ужимается но первая (150х50) вылезает вправо. Если указать и ширину и высоту - всё влезает но теряются пропорции.

Вот код реализации задуманного с использованием таблиц:

<table>
<tr>
<td class="customimg"><a href="link"><img src="image" width="100px"></a></td>
<td><a href="link">title</a><br>text...</td>
</tr>
</table>

и ксс стиль:

.customimg { max-height:100px; height:100px; max-width:100px; width:100px; }

если к стилю добавить "overflow:hidden;" картинка обрезается.

Edited January 30, 2012 by alleclf

[Arinden]

Может как-нибудь так? Вертикальное изображение можно разместить по центру.

Edited January 30, 2012 by Arinden

[Radiocity]

Можно картинку засунуть в

a {background:url('') no-repeat center; width:150px; height:150px; min-height:150px;}

[Great Rash]

http://jsfiddle.net/e3Eez/

[alleclf]

http://jsfiddle.net/e3Eez/

то что надо, спасибо.