モダンCSSでよく使用されるレイアウトを実装するまとめ

ヘッダ・フッタ・コンテンツ・サイドバー、フルページのレイアウト、最下部のフッタ、中央配置、カードなど、一般的なWebサイトやスマホアプリのUIをモダンCSSで実装する方法を紹介します。 CSSの実装はデバイスベースからコンテンツベースに移行しているのが現状です。これからのプロジェクトに役立つCSSのテクニックを解説します。 Layout patterns 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 モダンCSSで実装するレイアウト アスペクト比が維持される画像カード 最大値と最小値を決め、伸縮するカード コンテナに合わせて最適化されるカード スペースに合わせて伸縮するパンケーキ 聖杯レイアウト ラインナップ 積み重なるパンケーキ RAM (Repeat, Auto, Minmax) メディアクエリなしのサイドバー これからの

[coliss]

一般的なWebサイトやスマホアプリのUIをモダンCSSで実装するテクニックのまとめ。

[kuroaka1871]

いつか使いたい。IE完全に撲滅したら。。。

[primedesignworks]

IE ってクソなだけでなく、引退後も迷惑をかけ続けてるんだから、ビル・ゲイツは世界中のエンジニア・プログラマに対して IE 対応費用を払うべきだと思ってる。寄付してニコニコしてる場合ちゃうで。

[toaruR]

::innerと::outer を待って100年未だ来ず（´－｀）

[kyompi]

どっかのタイミングで最近のcssを全部舐めないとなーと思いつつ、でもこれ使うか・・・？必須か・・・？と疑問。結局見ないまま積まさってく。

[cu39]

ちょうど84000ブクマめ。

[Lhankor_Mhy]

いや、コンテナクエリはまだまだ未実装だろう。https://caniuse.com/css-container-queries