title: Media queries and screen orientation
body: <p>I'm creating a responsive design web page, and I want to ensure I do all the media queries correctly for different devices and orientations. </p>
  
  <p>This post suggests try using min-width and min-height media queries. And set up different break points for different resolutions.</p>
  
  <p><a href="https://stackoverflow.com/questions/8581998/screen-orientation-for-multiple-tablets-with-fluid-design">screen orientation for multiple tablets with fluid design</a></p>
  
  <p>Although, I found this method with the orientation (see below).
  Should I use this approach or the one above?
  Should I use @media screen, or should I consider all vs screen?</p>
  
  <pre><code>    @media screen and (min-width: 700px) and (orientation: landscape) { ... }
  </code></pre>