
An informal survey of z-index values found in the wild - H2NCH2COOH
https://psuter.net/2019/07/07/z-index
======
davidweatherall
With css scripting languages becoming a core part of the build set up I'm
amazed how many people still use 100 / 1000 / 10000 / 999 style z-index
values.

[https://gist.github.com/davidweatherall/dfc469b7a4451b169ae5...](https://gist.github.com/davidweatherall/dfc469b7a4451b169ae5d51445bf3f34)
Is my go to sass function for creating a simple to use z-index map.

~~~
ChrisSD
I'm guessing most people don't particularly care about z ordering. All they
want is something that says "this should be on top of everything else". Or
more rarely "this should be underneath everything else".

Aside from the extremes they are happy with the natural order, I think.

------
HeraldEmbar
This was fascinating, thanks. Made me think about why I used 99 as my max -- I
think it's because back in the SNES days, all the RPGs used 99 as a limit.

~~~
cneurotic
Someone should do an anthropological study.

"Final Fantasy? The Enduring Influence of JRPGs on Web Development Practices."

------
harimau777
Note: The following statements are for sake of argument and I realize that
they are likely not practical.

I think is a result of the fact that styling is outside the domain of front-
end software engineering. I don't mean this literally; clearly it is part of
the job description. What I mean is that as a software engineer my primary
skillset is in programming and CSS generally has very little to do with
programming.

This is true semantically (CSS lacks good support for variables, functions,
conditionals, etc.). However, it is also true in terms of of how designs are
generally structured. For example, layout tends to be "I want exactly this
spacing at this breakpoint and this spacing at this other breakpoint" instead
of "I want the spacing to scale according to this equation of screen size".

------
iambateman
9\. lol keep trying. 99. Doesn't work. 99999. Breaks modal.

...

9999\. Ahhhh....Just right.

------
Theodores
> At rank 39, we have 8675309, which I personally didn’t recognize as being
> particularly noteworthy. However, with over half a million collected uses,
> it clearly is meaningful to many.

Is this value there due to some stock value in some well used piece of
software such as a cookie notice plugin for Wordpress?

I had not realised this was a '42' grade special number before and I wonder
how it is so popular in CSS.

~~~
edoceo
Sing it. It's Jenny's phone number -
[https://en.wikipedia.org/wiki/867-5309/Jenny](https://en.wikipedia.org/wiki/867-5309/Jenny)

e: wiki

------
jedberg
I would have liked to see the first graph in number order instead of rank.
Being in rank order doesn't tell me much. Later is the graph with all numbers
in number order, but I think that first graph with just the top 50 would be
far more interesting in number order.

~~~
psuter
There you go: [https://psuter.net/images/z-index-fig-1-alt-
preview.png](https://psuter.net/images/z-index-fig-1-alt-preview.png)

~~~
dylan604
Has anyone tried calling the phone number used for a z-index in this chart?
Seems like a very specific number to be used that many times. It would be
amazing if the css was #ForAGoodTimeCall { z-index: 2147483647 }

~~~
notretarded
Max 32 bit signed integer in decimal.

------
klemek
Amazing job you did there. That's oddly interesting to measure a data we use
without common convention, it really draws out the human tendency of picking
up a number.

------
bennyp101
Would be interesting to know the selector grouping count as well, I would
assume most would be for things like '.overlay' or '.dropdown' etc

------
zachrose
I’m impressed by the author’s crawling of 112 million webpages, but I can’t
help but wonder if it’s really necessary. Surely the same distribution could
be found with a smaller sample?

~~~
rightbyte
He used a precompiled set to query so the cost wasn't that high.

------
carlob
The story about 8675309 is pretty interesting, but I prefer 6345789.

------
winrid
Really disappointed that 9001 did not make the list. :)

------
Haghn
From the article :

> Perhaps you will succeed where I failed, and find a way to include in a
> chart the largest z-index value I found, namely 10^1242-1.

> Yes, that’s 1242 times the number 9.

Come on, I know maths are no longer needed to be a developer, but this is
ridiculous.

~~~
cdirkx
Although the wording is ambiguous he probably (correctly) meant that the
number is 1242 9's long: 999999... and not 9^1242 or 1242 x 9

~~~
Haghn
Oh, I did not understand this way, but you are indeed correct. My bad.

~~~
arantius
This is why I care so much about grammar. Author wrote "1242 times the number
9" but meant "the number 9 1242 times". A very minor difference, just the
order of the words, but such a change in meaning!

