Как вписать картинку в контейнер?

Question

[SantyagoNN]

Допустим есть контейнер 600px на 400px. В него нужно вписывать картинки различных размеров. Наибольшая длина стороны картинки должна вписываться до краев этого контейнера (уменьшаться или увеличиваться).
Поясню на примерах: картинка 1200 на 500 должна быть уменьшена до 600 на 250 и размещена в центре контейнера.
Картинка 150 на 300 должна быть увеличена до 200 на 400 и размещена в центре.

Т.е. они всегда должны пропорционально увеличиваться или уменьшаться до бОльшей стороны контейнера.

Answer 1

[Андрей]

https://codepen.io/avkvak/pen/yprprm

Comments

[SantyagoNN]

Андрей спасибо, то что надо!

Answer 2

[aloky]

https://codepen.io/aloky/pen/VyNMEG

Answer 3

[SantyagoNN]

aloky Спасибо, все так, вы правильно поняли. А если мне нужно, чтобы картинка была не бакграундом, а в тэге img?

Comments

[aloky]

https://codepen.io/aloky/pen/VyNMEG

[aloky]

https://codepen.io/aloky/pen/QaPOag

[SantyagoNN]

aloky, Последнее решение хорошо работает с большими изображениями, но маленькие изображения не растягивает, просто размещает их по центру

[aloky]

SantyagoNN, https://codepen.io/aloky/pen/QaPOag