Hey everyone,
Is there a way to use density-independent pixel (dp) from Android in CSS? Or an alternative which does the same?
Thanks in advance :)
w3.org/TR/css3-values Every pixel is independent and resulting in poor UI on higher resolution devices. Can't find a fix for this yet maybe if you use js and calculate a dp like size in inches to get something more closer to what would be presentable for multiple devices.
Short answer: Yes; it's what px are.
Per Material.io:
A dp is equal to one physical pixel on a screen with a density of 160. To calculate dp:
dp = (width in pixels * 160) / screen density
When writing CSS, use px wherever dp or sp is stated. Dp only needs to be used in developing for Android.
Emphasis mine. See more about DP here.
Grey Davis
Frontend and other stuff
Not sure what you exactly mean by getting "density-independent pixel from android"..
But CSS pixels are device independent of the physical pixel density. That's why when you use px for sizing an element, it looks the same size across all the devices regardless of what dpi they have.
You can consider it as independent browser pixels that render the pages in some ratio to the actual device pixels.