JSFiddle - React, Tailwind, and code Playground

HTML

<div class = "other-half-circle">
  
</div>
<div class="half-circle">
</div>

CSS

.half-circle{
  float: left;
  width: 250px;
  height: 500px;
  background: url('http://i.imgur.com/CnjuZOS.jpg');
  background-position: top right;
  
}

.other-half-circle{
  float: left;
  width: 250px;
  height: 500px;
  background-position: top right;
  background: url('http://i.imgur.com/yAiPyc4.jpg');
}