0

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>
EDIT: (added the links that I tried) Two divs side by side - Fluid display Two images, side by side responsive Two image on the same row and with the same height CSS How can I make all images of different height and width the same via CSS? CSS - Divs with same height, but different image heights Making responsive images with different aspect ratios the same height + more. some of them use flex others table others they set the height to a constant, that's not what I'm looking for.

THANKS

moon
  • 35
  • 6
  • If you have looked at specific posts, best to mention them in your question and how they did not solve your problem, or your question will be closed as a duplicate. For instance, [How to resize images proportionally / keeping the aspect ratio?](https://stackoverflow.com/q/3971841/215552) has a number of CSS-only answers which don't use flexbox or grid... – Heretic Monkey May 11 '20 at 19:22
  • the answers in that question are 90% in javascript and the remaining 10% didn't work for me, thanks anyway :) – moon May 11 '20 at 19:27
  • Note I didn't say "for this specific question". I said "If you have looked at specific posts, best to mention them in your question and how they did not solve your problem, or your question will be closed as a duplicate." If you don't care if your question is closed as a duplicate, by all means, keep it as is. – Heretic Monkey May 11 '20 at 19:29
  • I will edit the links that I tried, and plz don't close my question – moon May 11 '20 at 19:32

1 Answers1

-2

try using 'em' or 'rem.' Those adjust depending on the size of the window.

  • thanks, I learned something today but now when I try to resize the browser only the width that changes, the height is constant. – moon May 11 '20 at 19:20