Aspect Ratio

by ananyaneogi

HTML

<img src="http://placekitten.com/1600/900">

CSS

body {
  margin: 0;
  padding: 0;
}

img {
    display: block;
    margin: auto;
    width: 100vw;
    height: calc((9/16)*100vw);
}

@media (min-aspect-ratio: 16/9) {
    img {
        height: 100vh;
        width: calc((16/9)*100vh);
    }
}