CODEWITHSUNDEEP
cssmedia-querieshybrid-mobile-app
Ragu
Ragu

Reputation: 412

Media Query for Samsung Galaxy Tab 4 - 7 inch

i am targeting my application for various Android Tablet devices. Mainly 10 inch and 7 inch Samsung and Nexus.

To target Samsung Galaxy Tab 7 inch used the below media query, 1024x600 px. It works fine in Galaxy tab 2, 3 of 7inch. But not working for Galaxy Tab 4 7 inch.

@media only screen and (max-width: 1024px) and (orientation : landscape)
{ }

Samsung Galaxy Tab 4.0 7 inch uses the following screen specification. Which is same for Samsung Galaxy 4.0 10.1 inch Model - SM-T530NYKAXAR. So on my 7inch Galaxy Tab 4, it uses the media query of Samsung Galaxy tab 4.0 10inch and loads the HTML pages odd.

How to target Samsung Galaxy Tab 4.0 7inch via media query.

Screen Specification:

Physical Size: 7 inch

Resolution: 1280x800 (Landscape)

Pixel Density: 216 ppi

Thanks.

Upvotes: 4

Views: 12173

Answers (1)

imaginethepoet
imaginethepoet

Reputation: 864

I've created this and tested it on the device and it seems to be highly targeted and works.

@media only screen 
and (min-device-width: 800px) 
and (max-device-height: 1280px) 
and (min-resolution: 192dpi)
and (-webkit-device-pixel-ratio:2)
and (orientation : portrait) 

{
  .galaxy {background-color:red;}
  .onlygalaxyportrait {display:block !important; background-color:green;}



}

@media only screen 
and (min-device-width: 1280px) 
and (max-device-height: 800px) 
and (min-resolution: 192dpi)
and (-webkit-device-pixel-ratio:2)
and (orientation : landscape) 

{
  .galaxy {background-color:yellow;}
  .onlygalaxyland {display:block !important; background-color:orange;}






}

Upvotes: 5

Related Questions