JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="items">
    <div class="items__item">
      <div class="items__cont item">
        <div class="item__text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam natus, et tempora voluptas, odit esse quaerat molestias placeat perferendis, maxime repellendus provident deleniti, ipsam voluptatem unde. Rem odit consectetur, voluptatem.</div>
        <div class="item__img"></div>
      </div>
    </div><!--//.items__item-->
    <div class="items__item">
      <div class="items__cont item">
        <div class="item__text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam natus, et tempora voluptas, odit esse quaerat molestias placeat perferendis, maxime repellendus provident deleniti, ipsam voluptatem unde. Rem odit consectetur, voluptatem.</div>
        <div class="item__img"></div>
      </div>
    </div><!--//.items__item-->
    <div class="items__item">
      <div class="items__cont item">
        <div class="item__text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam natus, et tempora voluptas, odit esse quaerat molestias placeat perferendis, maxime repellendus provident deleniti, ipsam voluptatem unde. Rem odit consectetur, voluptatem.</div>
        <div class="item__img"></div>
      </div>
    </div><!--//.items__item-->
  </div>
</div>

SCSS

.container {
  max-width: 90%;
  margin: auto;
  padding: 50px 0;
  position: relative;
  border-left:1px solid red;
  border-right:1px solid red;
  &::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    background: red;
  }
}

.item {
  display: flex;
  align-items: center;
  &__text {
     flex-grow: 1;
  }
  &__img {
     background: #555;
     width: 200px;
     height: 200px;
     flex-shrink: 0;
     border-radius: 50%;
  }
}

.items {
  &__item { display: flex; }
  &__cont { width: calc(50% + 100px); border: 1px solid green; }
  
  &__item:nth-child(odd) { justify-content: flex-start; }
  &__item:nth-child(odd) &__cont { flex-direction: row; }

  &__item:nth-child(even) { justify-content: flex-end; }
  &__item:nth-child(even) &__cont { flex-direction: row-reverse; }
}