-1

From Large Desktop Screen to Small Mobile Device: which are the Media Queries we should use?

I am bit confused with this. I am trying to get this clearly

/*Small Desktop*/

@media (max-width:1920px){

}
serv-inc
  • 35,772
  • 9
  • 166
  • 188
dheeraj aheer
  • 1
  • 1
  • 1
  • Please edit the question. It is not very clear what you are asking although I feel like you are trying to ask a valid question. – Etherealone Mar 31 '17 at 14:23
  • 1
    Check this [common-css-media-queries-break-points](http://stackoverflow.com/questions/16443380/common-css-media-queries-break-points) – Asons Mar 31 '17 at 14:28
  • Possible duplicate of [Common CSS Media Queries Break Points](http://stackoverflow.com/questions/16443380/common-css-media-queries-break-points) – serv-inc Apr 02 '17 at 18:51

1 Answers1

0

@media queries apply standard CSS only where the device's screen meets certain defined criteria (height, width, and pixel-ratio; mainly)

The best resource I've found for media queries is https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

Here's a snippet of the fantastic work there:

/* ----------- iPad mini ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}
GlennFriesen
  • 302
  • 4
  • 15