Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

@media: if samsung galaxy s4 is 1920x1080?

Tags:

css

smartphone

<link rel="stylesheet" media="only screen and (max-width:1280px)" href="css/article1280.css">

I'm in the middle of coding my responsive CSS and I realized that the Samsung Galaxy S4 smartphone has a screen resolution of 1080x1920—my 23" monitor is 1920x1080. I've never browsed on this phone (I have an iPhone 3 with a resolution of 320x480 which is what I thought all smartphones were around, somewhere under 800 pixels wide) so I'm a bit perplexed. How am I supposed to create a mobile website for a smartphone with a screen resolution of 1080x1920?

like image 798
user2441996 Avatar asked Jun 04 '13 17:06

user2441996


1 Answers

Galaxy S4 reports 360px x 640px to the browser

Aspect ratio is 9/16

Pixel ratio is 3

@media screen and (max-device-width: 360px)

@media screen and (-webkit-min-device-pixel-ratio: 3)

@media screen and (device-aspect-ratio: 9/16)
like image 194
Brian P Avatar answered Sep 17 '22 19:09

Brian P