twan
twan

Reputation: 2659

Which media query needs to be first in a css file? Portrait or landscape

I need to target phones that are in landscape mode, but somehow it doesn't change the css when in landscape. I added the landscape media query after my portrait media query like so:

@media screen and (max-width:767px)
    {

    }

@media screen and (max-width:767px) and (orientation:landscape){
    .header-top-bar, .header, .row, .announcement, .menu-container {
        width: 462px;       
    }

Do I need to use them in a specific order? My portrait media queries are working fine.

Upvotes: 1

Views: 68

Answers (1)

cheralathan
cheralathan

Reputation: 572

@media (max-device-width: 767px) and (orientation: landscape) {
  .header-top-bar, .header, .row, .announcement, .menu-container {
     width: 462px;       
  }
}

Try this max-width to max-device-width

Upvotes: 1

Related Questions