それは修辞的ではありません。私は、CSS の複数列レイアウトの優れた使用例を見つけることに本当に興味があります。
答えは簡単に思えます。 コンテンツを列に分割する場合は、列を使用しますよね? これは一般的に、CSS の複数列レイアウトがどのように機能するかを示す記事で見られる種類の例です。 アルマナック:
右に。 しかし、これは実際のユースケースですか？ うーん多分。 テキストが比較的短い場合は、おそらくいい感じです。 それが、自分のウェブサイトを再設計するときに自分自身に売り込んだ方法です。 数年前. 今日はそうではありませんが、当時はこんな感じでした。
しかし、長い記事全体が複数の列に分割されていますか? 私は新聞でそれが大好きですが、ウェブページを下にスクロールして XNUMX つのコラムを読むのを躊躇します。
XNUMX つの要素を並べて配置するために使用できると思いますが、それには flexbox の方が適しています。 さらに、制限により、列を選択して個別にサイズを変更することはできません。 列は同じ幅でなければなりません。
列がそれらに向いていることの XNUMX つは、それらが唯一の CSS レイアウト方法であるということです。 断片 コンテンツ。 (つまり、カウントしない限り CSS リージョン… とにかく、それらはどうなったの?!) したがって、段落を列に分割したい場合は、追加のラッパーなしで既に可能です。
コンテンツの連続ブロックを列に分割する必要があるのは、他にどのような場合ですか? 大量の古い順序付けられていないアイテムのリストを持っていたときに、それを行う必要があったことを覚えています。 リストがコンテンツを簡単にスキャンできるようにする方法は気に入っていますが、リストが長いとページの片面が非常に重く見える場合があります。 たとえば、CSS-Tricks のすべての投稿タグをアルファベット順にリストしているとしましょう。 そのためには、複数列のレイアウトが美しく機能します。
ビューポートの幅を変更してみてください。 XNUMX つの列が定義されていますが、使用可能なスペースの量に基づいて数が変わります。 メディア クエリを使わなくても、レスポンシブの良さが気に入らなければなりません。
私はのデモに取り組んでいました :left 疑似クラスと到達 columns デモを印刷するために物事を断片化するのに最適な方法だからです。 だから、私は別のユースケースがあると思います。 デモを作成しているときに、複数列のレイアウトを使用して、画像ギャラリーのようなアイテムの石積みグリッドを作成できることに気付きました。
しかし、他に何がありますか？ 短い段落、長いリスト、自由に流れるグリッドに制限されていますか?
