Im trying to style for the Kindle Fire HDX 8.9.
On amazon's website
the resolution is listed as 2560 x 1600. However when I target it with media queries at this resolution, it doesnt work. The rest of the query below seems to work, but I'd like to get the specific resolution right in order not to target hi-res monitors:
@media only screen
and (-webkit-device-pixel-ratio: 2) and (max-resolution: 800dpi) and (orientation : landscape)
I've tried (max-width: 2560px) and (min-width: 1600px) in addition to this, but this doesn't seem to work. Do I need to reduce the pixels to account for the pixel ratio?
For Kindle Fire HDX which is 1.5 xhdpi you need:
@media only screen and (min-device-width: 1200px)
and (max-device-width: 1600px)
and (-webkit-device-pixel-ratio: 1.5) {
This will work for both Kindle version, HD and HDX, that's why I used min and max width.
Model resolution PPCM (PPI) Pixel Ratio
Kindle Fire HD 8.9" 1920x1200 100 (254) 1.5 hdpi
Kindle Fire HDX 8.9" 2560x1600 133 (339) 1.5 xhdpi