JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper" id="bg-wrapper">
    <div class="banner">
      <h4>
      willkommen
    </div>
    <div class="banner">
      <h4>
      willkommen
    </div>
    <div class="banner">
      <h4>
      willkommen
    </div>
    <div class="banner">
      <h4>
      willkommen
    </div>
</div>
<div class="wrapper">
  <div class="divider" style="left:25%;">
  </div>
  <div class="divider" style="left: 50%;">
  </div>
  <div class="divider" style="left:75%;">
  </div>
</div>

CSS

.wrapper {
  width: 100%;
  height:400px;
  margin:0;
  padding:0;
  position: absolute;
  top:0;
  left:0;
}

#bg-wrapper {
  background-image: url('http://www.gstatic.com/webp/gallery/1.jpg');
  background-size: cover; /** Also try "contain" **/
}

.banner {
  float: left;
  margin-top: 250px;
  width: 25%;
  height: 50px;
  background-color: green;
  vertical-align:middle;
  text-align: center;
}

.divider {
  position: absolute;
  width:2%;
  height: 100%;
  background-color: white;
  margin: 0 0 0 -1%;
  padding: 0;
}