タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

cssに関するihirokyxのブックマーク (2)

  • コンテナ要素に基づく相対的な CSS の単位(cqw, cqh, cqi, cqb, cqmin, cqmax)

    コンテナクエリ(@container)とは、親コンテナ要素に基づいてスタイルを定義できる CSS の機能です。メディアクエリ(@media)では画面全体の幅に応じてスタイルを変更する必要がありましたが、コンテナクエリでは任意の要素に基づいたスタイルを適用できるため、より柔軟なレイアウトの実現が可能です。 .card { display: grid; grid-template-columns: 1fr; } @container (min-width: 600px) { /* カードの親要素の幅が 600px 以上の場合、2 列に変更 */ .card { display: grid; grid-template-columns: 1fr 1fr; } } コンテナクエリを使用してスタイルを適用する場合、コンテナクエリ単位を使用できます。コンテナクエリ単位は、親コンテナ要素に対する相対的な

    コンテナ要素に基づく相対的な CSS の単位(cqw, cqh, cqi, cqb, cqmin, cqmax)
    ihirokyx
    ihirokyx 2024/04/22
  • How To Center a Div

    IntroductionFor a long time, centering an element within its parent was a surprisingly tricky thing to do. As CSS has evolved, we've been granted more and more tools we can use to solve this problem. These days, we're spoiled for choice! I decided to create this tutorial to help you understand the trade-offs between different approaches, and to give you an arsenal of strategies you can use, to han

    How To Center a Div
  • 1