Breaking News: Grepper is joining You.com. Read the official announcement!

aspect ratio css media query

Cloudy Cheetah answered on August 11, 2020 Popularity 9/10 Helpfulness 3/10

answer aspect ratio css media query

related css media query aspect ratio

aspect ratio css media query

Comment

/* 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 */
  }
}

Popularity 9/10 Helpfulness 3/10 Language css

Source: developer.mozilla.org

Tags: aspect-ratio css media

Link to this answer
Share Copy Link

Contributed on Apr 17 2022

Cloudy Cheetah

0 Answers Avg Quality 2/10

Closely Related Answers

css media query aspect ratio

Comment

/* 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 */
  }
}

Popularity 9/10 Helpfulness 9/10 Language css

Source: developer.mozilla.org

Tags: aspect-ratio aspect-rat

Link to this answer
Share Copy Link

Contributed on Aug 11 2020

Cookie_Wookie_7

0 Answers Avg Quality 2/10

aspect ratio css media query

Contents

More Related Answers

aspect ratio css media query

Closely Related Answers

css media query aspect ratio

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.