Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Sean McCully
Sean McCully
6,177 Points

Can someone confirm the difference between iOS points, android dps, CSS pxs and a printers point?

This has been boggling me for a long time. After thorough research, this is what I believe to be true...

An iOS pt is a density independent unit of measurement, and so are Android dps and CSS px. An iOS pt is equal to 1 pixel on a 163 ppi screen, an Android dp is equal to 1 pixel on a 160 ppi screen, and a CSS px is equal to 1/96th of an inch (http://blog.fluidui.com/designing-for-mobile-101-pixels-points-and-resolutions/)

So...

1 iOS pt = 1/163 inch

1 Android dp = 1/160 inch

1 CSS px = 1/96th inch

I just want to confirm I'm thinking about this correctly. It doesn't help that a printers point is 1/72 inch (from what I understand, this unit of measurement has no relation to an iOS point at all) and 1 CSS px has a completely different meaning to an actual pixel (picture element).

The only mystery left unsolved is that if I make a 10pt line in iOS, a 10dp line in Android, and a 10px line in CSS, will they all be different physical sizes? So 10px in a safari mobile web browser would be a different physical size than 10pt in a iOS application?