JSFiddle - React, Tailwind, and code Playground

by Max Lensky

HTML

<div class="wrapper clear"> 
   <div class="of"> 
     <h3>EROTIC ALBUM</h3>
     <p><img src="http://www.music-bazaar.com/album-images/vol12/587/587416/2426056-big/Erotic-House-cover.jpg" /></p>
   </div>
   <div class="ofset"> 
     <h3>PORTFOLIO MY MODEL</h3>
     <p> <img src="http://www.canvasprintart.co.uk/passerby/pics/erotic2-lecanvas" /></p>
  </div>
</div>

CSS

*{
  margin:0;
  padding:0;
}
html,body{
  height:100%;
  background:#ffffff;
}
.wrapper{
  width:90%;
  margin:10px auto;
  border:1px solid #000;
  text-align:center;
}
.clear{
  display:block;
  clear:both;
}
.clear:after{
  content:'';
  display:block;
  clear:both;
}
.wrapper .of,.ofset{
  float:left;
  box-sizing:border-box;
  min-height:100px;
  padding:10px;
}
.of{
  width:40%;
}
.ofset{
  width:60%;
}
.wrapper img{
  display:block;
  width:90%;
}
.wrapper .of h3,.ofset h3{
 font-size:2vw;
  height:auto;
}