Live data from Hacker News

CSS px is an Angular Measurement

inamidst.com

41–50 of 62 posts

Re: CSS px is an Angular Measurement

#41
post #38
post #35

Earlier quoted context omitted.

Is anybody else having problems with notifo-based comment notifications? I am receiving them, but the links stopped working sometime between Jan. 22 and March 8.

http://blog.notifo.com/notifo

Oh dear. Thanks for the heads-up; this is sort of unfortunate since (as far as I know) HN doesn't provide any other way to be notified of comment replies.

Re: CSS px is an Angular Measurement

#42
post #33
post #5

This is dumb. The fact that one pixel subtends a particular visual angle does not imply that N pixels subtend N times that angle. It should be very plain to anybody implementing or using a rendering engine that pixels are intended to be linearly additive. This implies that N pixels will subtend less than N times the angle one pixel subtends. On a flat screen, this is normal and expected, because a pixel further from…

You're right, and the article linked here is wrong. The CSS spec doesn't say that px is an angular measurement, and the formula given that is supposed to convert between px and radians has no basis in the spec. The spec specifically defines px as a length; angular measurements only become relevant in calculating the reference pixel, which is a length used to define the size of 1px in circumstances where physical pixe…

OK, so based on the following spec:

> It is recommended that the reference pixel be the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm's length. For a nominal arm's length of 28 inches...

It would seem that the reference pixel is simply 1/2688 of the typical distance between your eyes and the device. If a device is meant to be used at half the "arm's length" distance (14 in), the reference pixel on that device would be only half as large. If a device is meant to be used at 3x times the distance (84 in), the reference pixel would be 3x larger. Much easier than angular diameters.

Re: CSS px is an Angular Measurement

#43
post #40

Earlier quoted context omitted.

The fact that this measurement is an approximation (and a very good one in fact) doesn't make it "dumb". In fact, it's flat displays that are "dumb". An optimal display would be curved so that each pixel subtends a roughly equal visual angle, and it's only the fact that most displays subtend a relatively small visual angle that allows us to approximate this with flat displays.

A curved display (let's say, spherical) centered approximately at the "primary" observer's eyeballs whose pixel elements all subtend equal solid angles would (a) lead to weird unintuitive and hard-to-program-for locations in their most natural expressions the further you wandered from the center-horizontal or center-vertical row/column of pixels; (b) make it very hard to those whose eyeballs aren't smack-dab in the c…

I agree that a spherical display the size of a monitor or TV would be unweildy; however a head-mounted display with a large field of view would work best if it was curved.

Re: CSS px is an Angular Measurement

#44

This is one of the more important Hacker News submissions I've seen in a long time. It seems that there is, potentially, a fundamental disconnect between what "px" is supposed to mean and what it means in practice . Given the incredible importance of the web, particularly the front-end of the web, and the extraordinary increases in screen resolution (today the iPhone 4 and iPad 3, tomorrow most computers), it's very…

High-resolution devices (that includes iPhone 4 and iPad 3, but also every single printer anyone's used in the last 5+ years) are exactly why the spec says what it says. The only other option was to not have a "px" unit in the spec at all.

I mean, think about it. Say you have a 600dpi printer. Take a typical web page that sets its body element to be 1000px wide, because the person writing it was using a 96dpi display. If "px" really meant "smallest controllable dot", that web page would print about 1.66 inches wide. Which is obviously undesirable. On the other hand, if "px" means "the length that looks about as long as one pixel on a 96dpi display" then the same web page would print about 8 inches wide, which is probably much closer to what both author and user wanted.

This is also exactly why Apple did the "pixel doubling" thing on iPhone 4 and iPad 3: it was done to prevent existing content that made certain assumptions about the visible size of "px" from breaking.

Re: CSS px is an Angular Measurement

#45
post #19

Earlier quoted context omitted.

I'm afraid this boat has long sailed. The "pixel" term is in the CSS 2.1 Spec. It's set in stone. Personally I've made peace with it. I say either "CSS pixels" or "device pixels", depending on what I want to express. And although the high resolution screens have only made the difference between the two more visible, it was there since Opera featured full pages zoom many years ago, and when Mobile Safari introduced th…

Unfortunately, redefining "px" from its original meaning as "device pixels" to a new meaning of "probably one 96th of an inch except on mobile browsers where ..." means that CSS no longer has any way to express "device pixels".

What are the use cases for expressing "device pixels" in a world of widely varying (both across devices and in time) device pixel densities?

Re: CSS px is an Angular Measurement

#46

Earlier quoted context omitted.

Use em, yes, but meanwhile "px" should have continued to mean "pixel", not "96th of an inch except on mobile where ...". Occasionally you really do need to talk about pixels in CSS, and redefining "px" makes that impossible.

I was at the same time telling myself that we really need to start using em more often. I have used px so many times at this point because it's more convenient for precise aligning. This is actually going to be a problem considering retina display macbooks might be coming soon.

It's not going to be a problem, precisely because a "px" in CSS doesn't mean an actual device pixel.

And that's because we've had "retina" devices for many years now, called "printers" and CSS was designed to deal with that situation from the start.

Re: CSS px is an Angular Measurement

#47

I've mentioned this before and I'm not the first to say it, but it's time to stop using px and start using in its place absolute measurements like inches or millimeters. It's the only sane approach to supporting different resolution displays.

Absolute measurements (which no longer exist in CSS) are a sane approach to support different resolution displays that are all used at the same viewing distance.

Using absolute measurements to size things on a web page that is then viewed on a TV (viewing distance in the 5-15ft range), a tablet (viewing distance in the 1-2ft range), and an eyeglass HUD (viewing distance in the 1-3in range) would be a disaster.

The fact that people _were_ using inches and millimeters on the web and expecting them to somehow work across all these devices is why they're all now defined in terms of CSS reference pixels...

Re: CSS px is an Angular Measurement

#48

Earlier quoted context omitted.

I'm not a web designer. Can you explain to me why it's important to be able to position/size something to exactly N pixels, rather than to exactly kN pixels (where k is some integer decided by the browser implementor)?

The biggest reason is that most css properties ignore fractional px values—you can't draw a .5px border, for instance.

This is only true in some UAs.

Gecko has supported fractional pixel values for years in general, though for borders in particular the width is clamped to integer _device_ (not CSS) pixels.

WebKit has been rounding them at parse time (even in cases when 1 CSS px is multiple device pixels) for a while, but they're about to fix that.

I believe that IE also supports subpixel layout. Not sure about Opera, offhand.

Re: CSS px is an Angular Measurement

#49
post #8

Earlier quoted context omitted.

If they had set 1 px = 1 pixel, almost all Web pages would be unreadably small. AFAIK, Web designers don't use pt.

And people would have quickly learned to not use "pixel" unless they really mean "pixel".

You never really mean pixel, so I guess you're arguing for the removal of the px unit completely. (bzbarsky explained this better: http://news.ycombinator.com/item?id=3697227 ) Then designers would start asking for a unit that is resolution-independent but always an integer multiple of pixels — essentially px under a different name. The px unit is really useful, but maybe it should have had a different name; it's too late to argue about it now.

Re: CSS px is an Angular Measurement

#50
post #27

Earlier quoted context omitted.

That's actually a very good point, don't know why you're being downvoted.

I find it interesting that I was downvoted to the negatives, then you posted this reply, and then I got upvoted to the top. I wonder what the causation is there. I suspect I know why I was downvoted; I used unnecessary emotive language ("dumb") and didn't explain my point clearly. Most of the rest of the commenters were focused on one part of the article's point, which is very relevant -- the idea that a pixel is no…

Sorry, I mistakenly downvoted you. I only skimmed the article since I already knew the history of px, and then I misread your comment; I thought you were arguing the opposite position (which is indeed dumb and pedantic).

Of course, when you complain about being downvoted it shames people into upvoting you (sort of like when adults bully children into fake-apologizing for something they're not sorry about).

Post reply on HN