JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<div id="choise">
  <div class="row">
    <div class="left">
      <div class="image-block">
        <div class="image" style="background: url(http://picsum.photos/1200/900) no-repeat;"></div>
      </div>
    </div>
    <div class="left"></div>
  </div>
</div>

CSS

body {
  background: white;
  margin: 0;
}
* {
  box-sizing: border-box;
}
div#choise {
  width: 100%;
  position: relative;
  padding: 18px;
  background: #000233;
}
div#choise div.row {
  width: 100%;
  position: relative;
}
div#choise div.row:after {
  content: '';
  display: table;
  clear: both;
}
div#choise div.row div.left {
  width: 50%;
  float: left;
  position: relative;
  overflow: hidden;
  padding-top: 30%;
  background:red;
}
div#choise div.row div.left