![](https://cdn-ak-scissors.b.st-hatena.com/image/square/7dc81eb20dda8075316cd62a4af82dd688c60024/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--2eymZFpe--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3A%2525E3%252580%252590Tailwind%2525E5%252592%25258C%2525E8%2525A8%2525B3%2525E3%252580%252591FLEXBOX%252520AND%252520GRID%25252FGrid%252520Row%252520Start%252520%25252F%252520End%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3ADaniel%252Cx_203%252Cy_98%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyLzU2NzZkZDg2ODkuanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_72%2Fog-base.png)
エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
【Tailwind和訳】FLEXBOX AND GRID/Grid Row Start / End
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
【Tailwind和訳】FLEXBOX AND GRID/Grid Row Start / End
<div class="grid grid-rows-3 grid-flow-col gap-4"> <div class="row-span-3 ...">1</div> <div class... <div class="grid grid-rows-3 grid-flow-col gap-4"> <div class="row-span-3 ...">1</div> <div class="col-span-2 ...">2</div> <div class="row-span-2 col-span-2 ...">3</div> </div> 開始線と終了線 row-start-{n}およびrow-end-{n}ユーティリティーを使用すると、要素を n 番目のグリッドラインで開始または終了させることができます。また、これらはrow-span-{n}ユーティリティと組み合わせて、特定の数の行にまたがることができます。 CSS のグリッドラインは 0 ではなく 1 から始まるので、3 行グリッドのフルハイトの要素は 1 行目から始まり、4 行目で終わることになります。 <div cla