CSS Responsive Layouts Media Queries Media Query Review

Why don't we just set the min-width to one value - 700px?

I really like this lesson, but I don't understand why Nick created two media queries- min-width: 769px at any orentation, but if the orentation is landscape min-width:700px; why don't we just combine both these rules and set the min-width: 700px at any orentation. Thank you so much! Hope you get my thought.

1 Answer

Jordan Watson
Jordan Watson
14,738 Points

The reason there is two is because it is a layout preference for the point of teaching the "and" operator is used to make sure the min-width is set 700px and the orientation is landscape therefor sets a better layout for the specific device. It is entirely down to the given design.

It may look like they both can achieve the same thing but in essence they perform different logic if you can call it that.

So essentially its an case of saying:-

@media only screen and (min-width: 768px), 

or

only screen and (min-width: 700px) and (orientation: landscape){
  /*CSS HERE*/
}