JSFiddle - React, Tailwind, and code Playground

HTML

<div class="side1">
<div class="center">
COOL SITE HERE
    </div>
<div class="left">
GIRL HERE
    </div>
</div>
<div class="side2">
<div class="right">
NOTHING HERE
    </div>
    </div>

CSS

.side1 {
     width: 50%;
     float: left;
     margin: 0 -260px 0 0;
 }
  .side1 div{
     margin: 0 260px 0 0;
     min-height: 300px;
 }
  .side2 {
     width: 50%;
     float: right;
     margin: 0 0 0 -260px;
 }
  .side2 div {
     margin: 0 0 0 260px;
     min-height: 300px;
 }
  .side1 .center {
     width: 520px;
     min-height: 300px;
     float: right;
     margin: 0 -260px 0 0;
     position: relative;
 }
  .center {
     background: #e37550;
 }
  .left {
     background: url('http://heiwan.narod2.ru/girlpeep.jpg') top right no-repeat;
 }
  .right {
     background: #fff;
 }