JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <div class="text">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris at eros in est condimentum commodo vel venenatis augue. Cras ex nisl, pharetra ac velit in, laoreet ornare ligula. Cras sit amet orci a nulla tincidunt malesuada quis sed diam. Donec sagittis
    quam orci, nec ullamcorper est rhoncus et. Maecenas et lacus at velit elementum consectetur quis a ante. Praesent dictum sollicitudin justo, non commodo turpis aliquam vel. Donec tristique velit quis justo tincidunt sollicitudin. Duis consectetur
    sit amet erat in fringilla. Nulla felis leo, efficitur sit amet efficitur quis, sagittis ut metus. Vestibulum at neque in velit blandit viverra aliquet eu libero. Nulla et odio velit. Duis rhoncus ante sit amet augue porta egestas. Donec accumsan
    placerat nulla rhoncus efficitur. In hac habitasse platea dictumst. Integer sed leo et velit condimentum condimentum in eget ante. Pellentesque efficitur sem lectus, et euismod massa mattis pretium.
  </div>
  <div class="image"></div>
</div>

SCSS

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.wrapper {
  border: 1px solid tomato;
  display: flex;
}

.text {
  width: 300px;
  height: 200px;
  overflow: hidden;
  margin-right: 10px;
}

.image {
  background: url("https://images.pexels.com/photos/448714/pexels-photo-448714.jpeg?w=1260&h=750&auto=compress&cs=tinysrgb") center center no-repeat;
  background-size: cover;
  flex: 1;
}