JSFiddle - React, Tailwind, and code Playground

by kodjoe mambi

HTML

<div class="about-wrapper">


    <div id="about-one">
    <h1 class="s1 type_second big-intro weight_lighter space-top-responsive space-top-responsive responsive-show" style="margin-bottom: 0em; margin-left: 10px; text-align: left;">Meet Suzanne, our manager.</h1><div class="hr-color-all responsive-show">&nbsp;</div><p class="p1"><span class="s1"> As owners and managers of a hand-picked collection of charming and well-appointed properties around the old town of Antibes we are proud to share the beauty and culture of the French Riviera. A très bientôt</span></p>
<img class="alignright wp-image-8169 size-full" src="http://www.rental.booclin.ovh/wp-content/uploads/2019/11/sign-suz.png" alt="" width="150" height="201"> 
    </div>
    
    
    <div id="about-two">
    <img class="book-position responsive-img-position space-bottom-responsive alignleft wp-image-8169 size-full responsive-show" style="margin-bottom: 120px!important;" src="http://www.rental.booclin.ovh/wp-content/uploads/2019/11/suzlast.jpg" alt="" width="400px">
    </div>
  </div>

CSS

#about-one {
  float:left; 
  margin-right:20px;
  width:50%;
}

@media screen and (max-width: 1024px) {
   #about-one { 
    float: none;
    width:100%;
  }
}