I googled everything and it seems that every example, every Stack Overflow answer doesn't work for me. I want to make two images the same height, I already made them the same width and I can make them the same height if I put for example img {height: 400px;}
but I don't want that because the when the screen resolution is smaller or larger that can look bad.
And I saw that this can be fixed by using flex or grid but I really don't want to, I know that there is a small solution for this or a simple hack, but if everything else failed I guess I have to.
This is the CSS and HTML code:
.container {
padding: 20px;
margin: 20px;
overflow: auto;
text-align: center;
}
img {
padding:3px;
width: 49%;
object-fit:cover;
box-sizing: border-box;
}
<div class="container">
<img src="https://www.w3schools.com/css/rock600x400.jpg"/>
<img src="https://www.w3schools.com/css/paris.jpg"/>
</div>
THANKS