JSFiddle - React, Tailwind, and code Playground

by kthornbloom

HTML

<div id="wrap">

  <div id="slide">
    <div class="content">
      hey hey hey
    </div>
    <div class="content">
      hey hey hey
    </div>
  </div>
</div>

CSS

#wrap {
  width: 100px;
  border: 1px solid red;
}

#slide {
  display: flex;
  transition: .2s;
  white-space: nowrap;
  transform: translateX(-100%);
}

.content {
  box-sizing: border-box;
  border: 1px solid blue;
  padding: 15px;
  width: 200px;
  min-width: 200px;
}