Масштабирование изображений разных размеров под контейнеры разных размеров

[web-web-web]

Черт его знает, почему оно работает, тот редкий случай, когда я не вполне понимаю, почему код ведет себя так, как ведет, но способ удобный и рабочий.


.parent-container {
position: relative;
overflow: hidden;
}

.parent-container img {
display: block;
position: absolute;
top: 50%;
left: 50%;
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
min-width: 100%;
min-height: 100%;
max-width: 150%;
max-height: 150%;
width: auto;
height: auto;
}