これは覚えておきたい！ コンテナ・ラッパーを定義するCSSの古い書き方とモダンCSSを使用した書き方

モダンCSSは今までJavaScriptが必要だったことやできなかったことを可能にしてきましたが、今までの記述をよりシンプルにすることもできます。 コンテナ・ラッパーを定義する際に記述するCSSの古い書き方とモダンCSSを使用した書き方を紹介します。 CSSの古い書き方 モダンCSSを使用した書き方 CSSの古い書き方 まずは、CSSの古い書き方。 ぱっと見で、何が設定されているのか分かるのがよいところです。コンテナの幅を100%にし、最大幅をmax-widthで設定し、paddingが上下左右に2remあって、margin: 0 auto;で中央に配置します。

[coliss]

コンテナ・ラッパーを定義する際に記述するCSSの古い書き方とモダンCSSを使用した書き方。

[gyochan]

自然言語的に何をやろうとしているかはオールドスタイルのほうが一目瞭然だよね。min関数が実質的に max-width を定義してるというところが混乱の元なんだけど

[takaesu]

container

[yoshi-na]

やっぱIEを切り捨てられる世界になったのが影響あるなあー

[tomono-blog]

読みづらいったらありゃしない

[Dursan]

wrapperの中のclass名は全て韻を踏まないといけないのよ

[yarumato]

“CSSの古い書き方　モダンCSS　min()は、すべてのエバーグリーンブラウザ（最新版に自動アップデートされる）でサポート。”

[Shinwiki]

“コンテナ・ラッパーを定義する” 書いてて何かに気付かないもんかね？HTML5でどういう棲み分けにするみたいなこと言ってなかったか？

[mon_sat]

なるほどー！ width に min() を使うのは便利だ。