Hacker News new | ask | show | jobs
by josephg 3369 days ago
The scientific notation one is a bug. Scientific notation isn't part of the CSS spec[1], and its not supported in all browsers.

I learned this one the hard way a few months ago. We ran into a flexbox bug in one browser which we worked around by adding some-rule: 0.0000001px instead of 0px. However, our minifier collapsed that using scientific notation, which triggered a rendering issue in a different browser due to the out-of-spec CSS. The whole adventure left me feeling like I'd travelled back in time.

[1] https://www.w3.org/TR/CSS21/syndata.html#numbers

3 comments

Scientific notation seems to be part of CCS3:

https://www.w3.org/TR/css3-values/#numbers

Which browser had problems with it?

"q" is also CSS3, incidentally, and its background is interesting[0]: it's a mostly japanese metric typographical unit[1], it replaces the point, and is slightly smaller: q is 0.25mm while pt is ~0.3528mm (precisely 1/72th of an inch which is 25.4mm).

[0] http://tosche.net/2013/10/font-size-in-the-metric-system_e.h...

[1] although non-japanese typographers like Otl Aicher have recommended its use it doesn't seem to have had much success outside Japan

"q" is not supported in the latest version of Chrome but is supported in Firefox. I'm debating using it on my site just to get a few headscratchers. Also to play off the weeb factor a bit as a joke. Thanks for introducing it to me.

Now to debate whether or not adding 3 lines of my CSS for a joke is too much.

"q" seems to be doomed to failure. If I were that interested in moving away from points and ems, why would I adopt arbitrary fractions of a millimeter when I could just use plain old SI units that are universally understood? It doesn't even save a byte at typical font sizes: 20q == 5mm.
Saving bytes in CSS was probably not the primary concern upon standardization in 1976. Note that the PostScript point (now the most common definition) is younger than that. Common usage doesn't always follow the best option that's available, as evident by many examples throughout history.

Furthermore, having a measurement that can frequently be used with integer dimensions is convenient, which is probably a large part why we still use points. 12 pt is a convenient font size, so is 4 mm (technically 4.2 mm, as 11.8 pt would be 4 mm), but while 10 pt is still convenient, 3.5 mm is less so. Smaller units lead to more useful integer values (within reason, of course).

It's in CSS because of its use in Japan; not an attempt to get elsewhere to adopt it.
> It doesn't even save a byte at typical font sizes: 20q == 5mm.

Typographers apparently use sub-millimeter precision for their sizes e.g. across 9 use cases Aicher had a single integral-millimiter font size[0]. The quarter-mm seems to have been the base multiplier suggested by DIN 16507-2, though it apparently also suggests 0.1 or 0.05mm when even more precision is necessary.

[0] https://en.wikipedia.org/wiki/Metric_typographic_units

> Scientific notation isn't […] supported in all browsers.

This has tripped me up many a time when I've created CSS colour strings (mostly for <canvas> use) by concatenating Strings and Numbers in JavaScript. When a Number gets small enough, it ends up in scientific notation, and the CSS parser rejects it.

That's a hell of a bug, always an adventure when the error locality is really far.