0

I need to make specific changes to the page layout for iPads 3.There is any media query css for I-pad3 9'7inch screen 1536 x 2048 pixels (~264 ppi pixel density)

parthiban
  • 25
  • 1
  • 8
  • So you need a media query that only fits iPad **3**? Or all 9.7-inch iPads? – xmcp Feb 02 '17 at 04:21
  • Possible duplicate of [CSS media query to target iPad and iPad only?](http://stackoverflow.com/questions/8271493/css-media-query-to-target-ipad-and-ipad-only) – xmcp Feb 02 '17 at 04:22

1 Answers1

2

The media query itself doesn't appear to have changed significantly from the previous iterations of the iPad with the exception that pixel ratio is set to handle retina displays via the -webkit-min-device-pixel-ratio attribute : 

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
     /* Place iPad 3 Styles Here */
}

These higher-resolution retina displays generally still report the same device-width as earlier versions, but you can think of the previously mentioned attribute effectively as a "multiplier" to your minimum and maximum values.

Rion Williams
  • 74,820
  • 37
  • 200
  • 327