Разместите изображение в div, где высота div основана на проценте заполнения, используя CSS

Question

Я хочу разместить изображение в div, где высота равна: height: 0; padding-bottom: 56.25%.
Я построил высоту таким образом, чтобы сохранить соотношение сторон.

Теперь я хочу, чтобы высота изображения равнялась отступу родительского элемента div.
Это для карусели, которая будет получать изображения различных размеров.

Есть идеи, как это можно сделать?

Спасибо!

HTML:

<div class="container">
    <div class="test">
        <img src="img/1.jpg">
    </div>
</div>

CSS:

.test {
    height: 0;
    padding-bottom: 56.25%;
    width: 100%;
}
.test img {
    width: inherit;
    height: inherit; // Inherit '0'...
    object-fit: contain;
}