Sometimes, we want to maintain the aspect ratio of a div with CSS.
In this article, we’ll look at how to maintain the aspect ratio of a div with CSS.
How to maintain the aspect ratio of a div with CSS?
To maintain the aspect ratio of a div with CSS, we use the aspect-ratio property.
For instance, we write
<div>aspect-ratio: 1 / 1;</div>
to add a div.
Then we write
div {
background: teal;
width: 50%;
aspect-ratio: 1 / 1;
}
to set the aspect ratio of the div to 1:1 with aspect-ratio: 1 / 1;
.
Conclusion
To maintain the aspect ratio of a div with CSS, we use the aspect-ratio property.