There are 4 different pictures with different widths and heights, you need to put them in an adaptive block, what do you recommend?

Question

css

Faced such problem: There are 6 images. Some are 120px wide some 209px wide. The problem is that the elements are very different and do not look beautiful. I am using owl-carousel. Displays 4 items per page.

Answer 1

you can use this principle:
background: url("your picture") 50% no-repeat;
background-size: cover;
width: 25%
padding top: 20% this value is from the ceiling, you need to specifically look at what you get
div mimics the behavior of img + background-size: cover
(padding is calculated from the width of the parent)