JSFiddle - React, Tailwind, and code Playground

by Roman Bruckner

HTML

<div class="flex-container">
  <div class="flex-child">1</div>
  <div class="flex-child">
    <div class="scroll-container">
       <div class="scroll-container-content">       
       </div>      
    </div>
  </div>
  <div class="flex-child">3</div>
</div>

CSS

.flex-container {
  display: flex;
  background-color: DodgerBlue;
  max-width: 600px;
}

.flex-child {
  background-color: #f1f1f1;
  margin: 10px;
  padding: 20px;
  font-size: 30px;
}

.scroll-container {
  overflow: scroll;
}

.scroll-container-content {
  width: 1200px;
  height: 200px;
}