JSFiddle - React, Tailwind, and code Playground

HTML

<body>

  <div id="wrapper">

    <div class="a">Text</div>
    <div class="b">Text</div>

  </div>

</body>

CSS

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

#wrapper {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  overflow-x: scroll;
}

.a,
.b {
  width: 100%;
  height: 100%;
  vertical-align: top;
  background-size: contain;
  background-repeat: no-repeat;
  display:inline-block;
}

.a {
  background-image: url(http://i67.tinypic.com/2wqv7fd.jpg);
}

.b {
  background-image: url(http://i67.tinypic.com/2lborxv.jpg);
}