Css media query aspect ratio

/* Minimum aspect ratio */
@media (min-aspect-ratio: 8/5) {
  div {
    background: #9af; /* blue */
  }
}

/* Maximum aspect ratio */
@media (max-aspect-ratio: 3/2) {
  div {
    background: #9ff;  /* cyan */
  }
}

/* Exact aspect ratio, put it at the bottom to avoid override*/
@media (aspect-ratio: 1/1) {
  div {
    background: #f9a; /* red */
  }
}

Source: developer.mozilla.org

Similar codes

1 vote193 views1 answer
Load css file flask
CSS
0 vote202 views2 answers
Styling links within a class except the last one
CSS
20 votes174 views3 answers
Css text selection none
CSS
0 vote184 views1 answer
Css preloader, preload website screen
CSS
0 vote167 views1 answer
Change disbled button background pyqt5
CSS
4 votes168 views3 answers
Zoom in and out iconhtml css
CSS
13 votes173 views3 answers
Repeat css
CSS
0 vote182 views1 answer
Cabin font download
CSS
0 vote194 views2 answers
Use font awesome as content in css
CSS
1 vote167 views1 answer
Meta refresh only once
CSS