Соотношение сторон медиа-запроса SCSS не работает

Question

Я новичок в SCSS, и я стараюсь поддерживать хорошее качество обложки моего сайта.В любом случае, css работает хорошо, а scss - нет.

SCSS

#page-login-index {
@media screen and (min-aspect-ratio: 5/4) {
    background-color: red;
}}

CSS

@media screen and (min-aspect-ratio: 5/4) {
#page-login-index {
background-color: red;
}}

Мне нужно сделать это в SCSS, так как язагрузка некоторых вещей из PHP.Я заметил, что соотношение сторон и соотношение сторон устройства не работает, в то время как минимальная высота работает нормально.

Answer 1

Я понял это.

, когда я написал

    @media (min-aspect-ratio: 5/4) {
        background-image: url('someurl');
    }

scss скомпилировал его в (минимальное соотношение сторон: 1,25) , что было неправильно

Мне пришлось поместить это как строку в переменную, например: $ aspect54: "(min-aspect-ratio: 5/4)";

так что в конце концов этовыглядело это

$aspect54 : "(min-aspect-ratio: 5/4)";        
@media #{$aspect54} {
            background-image: url('someurl');
        }