DEV Community

Discussion on: CSS Logos: Figma logo

Collapse
 
grahamthedev profile image
GrahamTheDev

I think I spend about 20% of my time on caniuse.com, followed by the inevitable โ€œso how the hell do I have a fallback while still future-proofingโ€ Google session ๐Ÿคฃ

Thread Thread
 
dailydevtips1 profile image
Chris Bongers

Did you find a "fallback" so you can still use aspect-ratio?

Thread Thread
 
grahamthedev profile image
GrahamTheDev
@supports not (aspect-ratio: auto) { 
    padding-top: 100%;
    height: 0;
    position: relative;
    overflow: hidden;

  }
Enter fullscreen mode Exit fullscreen mode

Something like that using the padding hack?

However it would need โ€œreversingโ€ so that you start with that and then reset everything if it Does have @supports For it, and then use aspect ratio instead if you wanted to support ancient browsers!

Thread Thread
 
dailydevtips1 profile image
Chris Bongers

Hmm yep!
For now I refactored it to just contain the height, as it's a known thing ๐Ÿ’–