Quantum CSS
-
Just saw this CSS written by our UX team:
margin-left: 0.714285714em;
So we have margins specified to 9 significant digits. If you don't know what that css means, it's not important -- point is, after quick napkin calculations with some assumptions about monitor pixel density, that 4 at the end (0.000000004em) is about 16 picometers, or half the atomic radius of a helium atom.
-
You need to find out what tool they are using which produces that crap and report back.
-
What if the font size is 714285714px? What then, smarty man?
-
@clively said:
You need to find out what tool they are using which produces that crap and report back.
I know the tool. I know where he sits, too.
Someone at work gave me a good followup punchline: and of course, helium atoms are different in IE.
-
@spinn said:
@clively said:
You need to find out what tool they are using which produces that crap and report back.
I know the tool. I know where he sits, too.
OK if this was done manually then I can see it. It's a dumb way that some people use to tell if something was just copy pasted from their stuff to someone else's thing.
-
@spinn said:
Good thing it didn't use 0.714285713em!Just saw this CSS written by our UX team:
margin-left: 0.714285714em;
So we have margins specified to 9 significant digits. If you don't know what that css means, it's not important -- point is, after quick napkin calculations with some assumptions about monitor pixel density, that 4 at the end (0.000000004em) is about 16 picometers, or half the atomic radius of a helium atom.
-
Looks like someone just used 5/7 and didn't worry about the precision. Why should they, so long as it's precise enough?
-
@boba_fett said:
Looks like someone just used 5/7 and didn't worry about the precision. Why should they, so long as it's precise enough?
I know you're not seriously asking, but the actual answer is that I'm tired of these non-developers caring fuck all for performance/maintenance. They have plenty of those 9-decimal styles in this one project we're working on, and I know it's not a lot in terms of performance to cut 7 digits off all of them to reduce total byte size, but it's just another brick in the wall, really.
-
@joe.edwards said:
What if the font size is 714285714px? What then, smarty man?
Then the margin would be exactly 510204081.224489796 pixels. I need a bigger screen. 1080p won't cut it anymore.
-
@spinn said:
[...] is about 16 picometers, or half the atomic radius of a helium atom.
I am appalled at your UX team's lack of precision. It is 24 orders of magnitude larger than the Planck length.
-
@spinn said:
about 16 picometers, or half the atomic radius of a helium atom.
You just know a client is going to say "hmm... it looks a tiny bit off"
-
"... make the margin two Plancks wider."
-
-
@boba_fett said:
Looks like someone just used 5/7 and didn't worry about the precision. Why should they, so long as it's precise enough?
This. Probably just copy&paste from
calculatorExcel.But why would anyone want to do this? Well, since em depends on the font size, you sometimes have to specify fractions if you want to align two elements exactly (and you don't want to use px everywhere):
<h1 style="font-size: 140%; margin-left: 0.714285714em">Example</h1> <p style="font-size: 100%; margin-left: 1em">1em * 100% / 140% = 0.714285714em</p>
-
Browsers round up or down or banker's to whole pixels anyway, and they don't do it consistently. Firefox tries to be intelligent about it, IE rounds up (still does?), Chrome I don't know.
-
@dhromed said:
@spinn said:
about 16 picometers, or half the atomic radius of a helium atom.
You just know a client is going to say "hmm... it looks a tiny bit off"
Dodgy, potential NSFW, meme-pic with sweary and racial stuff.
[mod - embedded pic changed to link to pic at request of OP - PJH]
-
@mikeTheLiar said:
[mod - embedded pic changed to link to pic at request of OP - PJH]
Is that OP as in, "original poster"? I didn't request that. (but if it's "operator" then nevermind)
-
-
@spinn said:
with some assumptions about monitor pixel density
Hum... Em size does not (better - SHOULD not) depend on pixel density. Neither does px, by the way.
-
@Mcoder said:
Neither does px, by the way.
Even if the pixel density is 1:1, my pixel is not the same size as your pixel. So you gotta take it into account if you're going to place something within half an atom's width of accuracy.
-
@dhromed said:
@Mcoder said:
Neither does px, by the way.
Even if the pixel density is 1:1, my pixel is not the same size as your pixel. So you gotta take it into account if you're going to place something within half an atom's width of accuracy.
Because as everybody knows, px is actually angular measurement.
-
@dhromed said:
@Mcoder said:
Hum... Em size does not (better - SHOULD not) depend on pixel density. Neither does px, by the way.
Even if the pixel density is 1:1, my pixel is not the same size as your pixel. So you gotta take it into account if you're going to place something within half an atom's width of accuracy.Yeah, exactly, so I had to pick specific pixels. What I meant was that I was assuming the monitor on my desk, and I started with 96 ppi. The document in question had a base of 16px font size.
(Next time I'll attach an appendix...?)
p.s.: dhromed, about that image: hur dur I'm an idiot, ignore me, sorry
-
@Faxmachinen said:
"... make the margin half a Planck wider."
FTFY.
-
-
@ender said:
@Faxmachinen said:
"... make the margin half a Planck wider."
FTFY.
Good luck explaining how that doesn't work to the client. Me, I just put the margin into a superposition of widths and answer every request with "OK done".
-
This, and exactly this, is why people should just start using calc in their CSS.
-
@Faxmachinen said:
Good luck explaining how that doesn't work to the client. Me, I just put the margin into a superposition of widths and answer every request with "OK done".
But that'll only last untill somebody looks at the margin, when the complete porpouse of the margin is being looked at. I porpouse you add some code to make it move all the time, in an unbiased random walk. That's the only way to satisfy the clients (or, at least, they won't be able to complain).
-
-
-
@Buttembly Coder said:
This, and exactly this, is why people should just start using calc in their CSS.
Thanks for linking me to that. I don't do web development at the moment, but a while back when I was, I was seriously considering writing a CSS preprocessor that expanded expressions like that into the right sequence of nested invisible <div>s. (It seems to have decent browser compatibility, too.)