How we actually measure the screen resolution in pixels for different screens.
The main reason am working on website which is responsive but I want to know how we measure the screen max-width in pixels for different screens. e.g iPhone 6 has screen resolution 750×1334 It means iPhone 6 has max-width in pixels is 750.am right.
12/7/2019 4:38:08 PMManinder $ingh
4 AnswersNew Answer
<!--this html code might help--> <!DOCTYPE html> <html> <body> </body> <script> document.body.innerHTML= "Height :"+window.innerHeight+" <br />"+"Width :"+window.innerWidth; </script> </html>
It depends on the context. The pixel pitch or pixel density (pixels per cm (ppcm)) of a display might not be relevant to how the device actually displays the website by default. For example, many phones actually use a much lower effective resolution when viewing mobile websites than their actual resolution. That's why many phones display as 360x640. This Wikipedia page should help increase your understanding of pixel density concepts: https://en.m.wikipedia.org/wiki/Pixel_density?wprov=sfla1 I would also look into designing for different aspect ratios. For example, when someone changes the orientation of their phone from portrait to landscape. Take a look at the most common screen sizes too. https://gs.statcounter.com/screen-resolution-stats
use viewport unit. for max width is 100vw
On your website, if you double click , or right click (on mouse), You’ll see the inspect element. Click inspect > it takes you to the Developer tools. There at the top left you’ll see pixels, and even devices. Choose one to see what your website looks like on that device. —