JSFiddle - React, Tailwind, and code Playground

HTML

<div>

  <div class="wrapper">
    <div class="images">
      <img src="https://storage.googleapis.com/pod_public/1300/121017.jpg" style="height: 200px;">
    </div>
    <div class="article">
      A car, or an automobile, is a motor vehicle with wheels. Most definitions of cars state that they run primarily on roads, seat one to eight people, have four wheels, and mainly transport people rather than cargo. There are around one billion cars in use worldwide.
    </div>
  </div>

  <br>

  <div class="wrapper">
    <div class="article">
      A car, or an automobile, is a motor vehicle with wheels. Most definitions of cars state that they run primarily on roads, seat one to eight people, have four wheels, and mainly transport people rather than cargo. There are around one billion cars in use worldwide.
    </div>
    <div class="images">
      <img src="https://storage.googleapis.com/pod_public/1300/121017.jpg" style="height: 200px;">
    </div>
  </div>

</div>

CSS

.wrapper
{
    border: 1px solid rgba(255,0,0,1.0);
  
    width: 90%;
    display: grid;
    grid-template-columns: auto auto;
    margin: auto auto;
}

.images
{
    border: 1px solid rgba(0,255,0,1.0);

    margin:       auto auto;
    margin-left:  10px;
    margin-right: 10px;
    transform: scale(0.5);
}

.images img
{
    display: block;
        /*top  right bottom left*/
    padding: 10px 10px  10px   10px;
    
    margin: auto auto;
    transform: rotate(5deg);
}

.article
{
    border: 1px solid rgba(0,0,255,1.0);
    margin-top:   0;
    margin-left:  10px;
    margin-right: 10px;
}