小 中 大
■ ■ ■ ■ ■ ■ ■

Home > 2022年 > 2月 > 8日

tailwind-cssで画面中央に表示するクラスはこれ、中央表示でググっても。

2022年02月08日

Logging

この頃、Bootstrapからtailwind-cssに変えようと奮闘中で勉強中です。そんな中でググっても中々ヒットしなかった事を紹介します。

tailwind-cssで画面中央に表示する方法を中央表示でググっても画面中央表示がヒットしなかったのは、少しやっかいだなって思いました。何でも検索出来るGさんですが、何度か自分はNot Foundページを見たことがあります。つい最近のNot Foundページは、こんな感じ釣り堀？で釣りをしている宇宙人さんみたいなが表示されます、そしてちょっとした操作が出来ます😌。

引用：Googleページ

脱線した話をもとに戻して…tailwind-cssで画面中央に表示したい場合は、このクラスを付与すると良いですよ😏。

<div class="h-screen w-screen flex justify-center items-center">
    <p>center</p>
</div>

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

投稿日時 2022年02月08 06:15日

タグ

Bootstrap, center&lt, div class, div&gt, gt, Gさん, h-screen w, justify-center items-center&quot, lt, Not Foundページ, p&gt, quot, screen flex, tailwind-css, クラス, もと, 奮闘中, 感じ釣り堀, 操作, 画面中央,