вложение точки разрыва ориентации в точку разрыва минимальной ширины

Question

я вложил точку разрыва ориентации в точку разрыва минимальной ширины (SCSS), например:

    @media only screen and (min-width : 481px) {
           @media only screen and (orientation: portrait) {
                // something
           }
           @media only screen and (orientation: landscape) {
                // something
           }

    }

мой вопрос: на что ссылается условие ширины? портрет или альбомная ориентация? или как это вообще работает?

Answer 1

Условие ширины медиазапроса всегда относится к ширине текущей ориентации. Поэтому, когда вы находитесь в портретном режиме на смартфоне, ширина будет более короткой стороной, если вы находитесь в альбомном режиме, условие ширины будет относиться к более длинной стороне.