Можно ли масштабировать изображение с сохранением пропорций только средствами CSS?

Question

[Ivan-P]

Есть блок 300х300 px. Можно ли сделать без JS что бы если картинка внутири блока шириной меньше 300, то растягивалась по-горизонтали с сохранением пропорций, а если не хватает высоты, то расстягивалать по-вертикали?

Вариант с оним измерением работает на ура, а вот двумя не могу ничего придумать...

Answer 1

[Андрей Чернышев]

img {
  background-size: cover
}

Пример

Answer 2

[chernyavskiy94]

img{
   width: 100%;
   height: auto;
}

Comments

[Ivan-P]

Таким способом подгоняются только узкие изображения, а короткие нет.

Answer 3

[Тимофей]

display: block (чтобы не появлялась пустая линия под картинкой)
max-width: 100%
max-height: 100%