CSS Aspect Ratio - Practical Example

Publicado em: 01 Fevereiro 2021
no canal de: A shot of code

476

The CSS aspect-ratio property is a new addition to CSS that allows us to enforce the correct sizing of items that don't have an intrinsic size. A good example here would be a you tube video embedded into a website using an iFrame. This tutorial video looks at that exact scenario and first checks out the current padding-top 'hack' that is utilized today to perform this. And then how to use the new aspect-ratio to replace this. The reduced clutter from using aspect-ratio and also the clarity that it provides is self evident at this point.

It should be noted that as of the time of this video the property is only available in chrome 88, but is implemented in Safari and Firefox behind a flag so will be covered in all major browsers in the near future.,

Reference to other information on aspect ratio:

https://css-tricks.com/aspect-ratio-b...

https://web.dev/aspect-ratio/

And for Beagle lovers the SmudgeTheBeagle youtube site!

/ smudgethebeagle

Nesta página do site você pode assistir ao vídeo on-line CSS Aspect Ratio - Practical Example duração hora minuto segundo em boa qualidade , que foi baixado pelo usuário A shot of code 01 Fevereiro 2021, compartilhe o link com seus amigos e conhecidos, no youtube este vídeo já foi visto 476 vezes e gostou 19 espectadores. Boa visualização!

195,840

8.9 mil