エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
CSSのGridをカジュアルに使いたい(雑記) - Qiita
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
CSSのGridをカジュアルに使いたい(雑記) - Qiita
思ったままに記述と検証を繰り返した記事です。 CSSのGridといえば、縦軸と横軸を決め、それあわせてボ... 思ったままに記述と検証を繰り返した記事です。 CSSのGridといえば、縦軸と横軸を決め、それあわせてボックスを配置できる技術です。grid-template-rows / columns や grid-template-areas を使って、ごにょごにょします。 しかしこれらを使用する場合は、限定的なレイアウトをしっかり組みたい時に利用する場合が多いと思います。 もっとカジュアルにGridが使いたいので、少し考えてみました。 ナビゲーションとか ナビゲーションの子同士でスペースが必要な場合があります。 今までなら「:first-child を使った marginの打ち消し」や「隣接セレクタ」でmarginを取っていました。 Gridとgapを使えば、簡単に子同士のスペースは簡単に開きます。 display: grid; と指定すれば一見通常フローの並びになりますが、子はGridコンテナに