Skip to content

Instantly share code, notes, and snippets.

@shepelevstas

shepelevstas/locked_aspect_ratio_block.css

Last active September 15, 2020 09:40
Show Gist options
  • Save shepelevstas/e241f43e6d1bcc0fc6508c5e2d73515a to your computer and use it in GitHub Desktop.
Save shepelevstas/e241f43e6d1bcc0fc6508c5e2d73515a to your computer and use it in GitHub Desktop.
Download ZIP
css block with fixed aspect ratio
Raw
locked_aspect_ratio_block.css
.fixed-ratio-block {
position: relative;
}
.fixed-ratio-block:before {
content: '';
display: block;
padding-top: 80%;
}
.fixed-ratio-block__content {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment