問題

全体コンテンツの高さが
・ファーストビューに収まらなかった時
・収まった時
↓
横へ少しだけズレが生じる

原因

全体コンテンツの高さによって横ズレが生じる問題は、スクロールバーの有無
・スクロールバーが表示される時 → 右側にスペースが生まれ、ページの幅が縮む。
・スクロールバーが表示されない時 → 幅が変わらない。

「Tailwind」の「overflow-y-scroll」を「html or body」に適用すると、常にスクロールバーを表示するのでズレがなくなる。

<body class="overflow-y-scroll">
  <div class="container mx-auto">
    <!-- コンテンツ -->
  </div>
</body>