How to specify a style that will work if none of the previous ones came up? should work on new chrome / opera / fairfox browsers on android and windows

@media (orientation: landscape),(min-width: 420px){111} @media (orientation: portrait),(max-width: 419px){222}

in some situation it does not work, I need to always include 111 if not selected 222

  • one
    Whatever style worked if the previous ones did not work, then connect it last. And what should work on "new" browsers depends on the properties you want to use. - user190134
  • with what parameters? - NormalArs
  • @NormalArs What is the problem to write @media (orientation: landscape), (max-width: 419px) {111} ? - A. Gusev

2 answers 2

Styles written outside the media query will work everywhere if they are not overridden by the media query. It will suit you like this:

 111 @media (orientation: portrait),(max-width: 419px){222}

everywhere where not 222 will work 111

    You just need to understand that styles are applied consistently. If some did not fit, then apply those that are higher. Up to default in the browser. In your case, there is a separation between landscape and portrait. So make two branches, in one style for landscape, in the other for portrait.

     ... @media (orientation: landscape),(min-width: 420px){111} @media (orientation: landscape),(max-width: 419px){111} @media (orientation: portrait),(min-width: 420px){222} @media (orientation: portrait),(max-width: 419px){222} ...

    In this spirit, for example.