Keep up aspect ratio of a div with CSS

Ask a question
0

<p>I want to create a <code>div</code> that can change its width/height as the window’s width changes.</p><p>Are there any CSS3 rules that would allow the height to change according to the width, <strong>while maintaining its aspect ratio</strong>?</p><p>I know I can do this via JavaScript, but I would prefer using only CSS.</p>

Coin iconoffer bounty
add comment

1 Answer

1

Hi,
You can give height in “vh” and width in “vw”. It will make your dive responsive as your screen size get smaller or wider. div will adjust itself according to window’s height & width.
Eg.

`height:90vh;
`width:95vw;

Check this example: https://codepen.io/jitens/pen/MMrJRy

add comment

Your Answer