2021年、CSSのクロスブラウザ対応の現状、SafariやFirefoxで起こる不具合の対応方法

2021年、CSSのクロスブラウザ対応の現状を紹介します。 Flexboxをはじめ、さまざまなCSSの魅力的な機能が主要ブラウザでサポートされ、CSSを書くことよりもデバッグして修正することの方が多いと嘆いたデベロッパーも減ってきたと思います。 しかし、いまだに修正が必要なCSSの問題点もあります。IEがなくなっても、SafariやFirefoxで起こる不具合の対応方法なども解説します。 The State of CSS Cross-Browser Development by Ahmad Shadeed 先日、MicrosoftからIE11サポート終了のお知らせがあり、ユーザーが世界規模のWordPressもIE11のサポートを終了します。これらの情報でIE11のサポート終了の流れは一気に加速しますね。 参考: Internet Explorer 11 デスクトップアプリは 2022年6

[coliss]

2021年、CSSのクロスブラウザ対応の現状、修正が必要なCSSの問題と対応方法。

[kagioo2uma]

iOSはSafariの使用を強制するのをやめろ。

[Lhankor_Mhy]

これ忘れてるよ( https://caniuse.com/mdn-css_properties_background-attachment_fixed )。なんか Safari に足を引っ張られること多いよね。/ とりあえず、aspect-ratio と grid: masonry は、全ブラウザでとっとと対応してほしいと思う。

[sometk]

制作に読んでもらいたいんだろうなあ、と／WPアップデートしたらfirefoxは崩れていたことがあった。

[Shinwiki]

FireFoxに発生する方を「不具合」と呼ぶのはどうかと。サファリはok

[mayumayu_nimolove]

日本は古いブラウザばかり対応してて、新しいブラウザの新機能だとか、これから使われるであろうところの知見吸収の優先度がおかしかったからな。やっと正常になる。

[ustam]

position: sticky; 周りのバグ多いよねえ。あとiOS Safariのインストールバナー。ウインドウごとボトムが隠れる仕様をなんとかしてほしい。この時も100vhが効かない。

[dambiyori]

CSS Gridなんてあるんだすごい！いろいろ知識が止まってる…

[rockname]

“先日、MicrosoftからIE11サポート終了のお知らせがあり、ユーザーが世界規模のWordPressもIE11のサポートを終了します。”