JSFiddle - React, Tailwind, and code Playground

by uedatakuya

HTML

<div class="scroll">
    <div class="cell">セル1<button onclick="alert('セル1')">ボタン</button></div>
    <div class="cell">セル2<button onclick="alert('セル2')">ボタン</button></div>
    <div class="cell">セル3<button onclick="alert('セル3')">ボタン</button></div>
    <div class="cell">セル4<button onclick="alert('セル4')">ボタン</button></div>
    <div class="cell">セル5<button onclick="alert('セル5')">ボタン</button></div>
</div>

CSS

.scroll {
    background-color: red;
    height: 300px;
    width: 400px;
    overflow-y: scroll;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.cell {
    background-color: blue;
    border: 1px black solid;
    color: white;
    height: 100px;
    width: 400px;
}