Death to px, long live ch!
Terence Eden argues that pixels are a lie—CSS pixels don't map to physical pixels, and even centimeters are perceptual. For a text-heavy blog, he sets the main content width using the `ch` unit (character width) to ensure readability, and uses `ex` for vertical spacing. He shares his CSS snippet and notes that while he hasn't replaced every `px`, he's experimenting with relative units for a more proportionally consistent design.
Pixels are a lie. Even if you think you're drawing something with 'pixel perfect' accuracy, your monitor is lying to you.
- somat
What I want to know is who decided to break px, the last thing we need is yet another screwball physical measurement, css was already full of them. But what "tut tut, everybody is using px and these new hi-dpi displays are rendering things really tiny, we can't have that" and now px as a useful unit is ruined.
Is there a way to use real pixels? My, admittedly quick, search says no. at least nothing jumps out at me from the spec.
- microflash
I’ve found that ch and ex units are heavily influenced by latin characters. They just give weird results with non-latin characters leading to magic numbers. But the concept is really solid: use them if you want the spacing relative to text.
- npn
I also did some experiment with ch many years ago. I found that 60ch is ideal width for block text for easy reading. too bad it is pretty hard to make websites with only 60ch wide.
- larusso
I’m somewhat out of the loop but I remember the time everybody switched from px to em’s. When I came back to CSS for a short while it was px again and behold it worked for 4K screens. To be honest I didn’t really liked the usage of em and actually prefer px.
- squidlib
I’d like to hear the author’s approach to vw and vh units. I’ve tended to use these units where I want a specific feel and it’s worked relatively well over the years. I’m surprised it was not mentioned given the justifying of ch was around the desire of a consistent layout.