アスペクト比を定義できるCSSプロパティ aspect-ratio

画像や動画のプレースホルダを用意したり、サイズがまちまちなサムネイルを並べたり、レスポンシブに対応しつつ実現するときに便利な aspect-ratio。CSSでアスペクト比を定義できるこのプロパティ、Chome 88 では既にサポートされていますが、その他のブラウザではどうでしょうか。ちょっと can i use… してみました。

CSS property: aspect-ratio
aspect-ratio

赤いですね!

FirefoxとSafariでももうすぐサポートされるって聞いてましたが真っ赤ですね。CLS対策にも一役買いそうなのでゴリゴリ使っていきたい所でしたが、もうちょっと待つ必要があるかもしれません。paddingハックで頑張ってきたアレもコレも、このプロパティさえ使えたらずいぶん手軽になるのに。そして object-fitプロパティと併用するとものすごく便利なので他のブラウザたちでも早くサポートしてほしいですonegai02.gif

トラックバックURL