JSFiddle - React, Tailwind, and code Playground

HTML

<!--
The same thing also happens if you:

* Change `margin: auto;` to `justify-self: start;`
* Remove `margin: auto;` and add `justify-content: start;` to the grid

Since they all cause the grid item to size exactly to its maximum size.
-->
<div style="display: grid; height: 300px;">
  <div style="margin: auto; overflow: auto; height: 100px;">
    <div style="width: 100px; height: 200px;"></div>
  </div>
</div>