Centering in CSS

この記事でのおすすめのCSS

.gentle-flex {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1ch;
}

Taiwind CSSでの記述

<div class="flex flex-col items-center justify-center h-screen gap-4">

Taiwind CSSでは単位chでのgapの指定ができないので、「gap:1ch」の代わりに1remのgapを指定