JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
  <div class="child1 child">
    <img src="https://via.placeholder.com/1025x550.png">
  </div>
  <div class="child2 child">
  <img src="https://via.placeholder.com/1025x550.png">
  </div>
</div>

SCSS

* {
  box-sizing: border-box;
}

.parent{
  border: 10px solid blue;
  overflow: hidden;
  height: auto;
}

.child{
  box-sizing: border-box;
  height: auto;
}
.child1 {
  float:left;
  width: 60%;
  border: 10px solid green;
}
.child2 {
  float:left;
  width: 40%;
  border : 10px solid red;
}

img{
  width: 100%;
  height: auto;
}