This is a great counter-argument, and seems applicable too when you have to build generic components to follow your own design system. Not using z-index would mean tying to implementation details (of how the markup appears) and making them less flexible.
Thanks for your insight - I thought there would be a valid use case for it, but couldn't think of anything to prove my colleague wrong when they thought z-index should never be used. Now that gives me some food for thought!
A follow-up question: do you know by any chance how z-index affects things like keyboard accessibility? For example, will elements with a higher z-index be reached first when navigating with keyboard tabbing?
I'm a Systems Reliability and DevOps engineer for Netdata Inc. When not working, I enjoy studying linguistics and history, playing video games, and cooking all kinds of international cuisine.
I'm actually not sure. I suspect that higher z-index values will be earlier in the tab order, but only if they're explicitly called out (because tab order, unless overridden, normally follows markup order). Regardless, it's not something I would think you should rely on if it does, because then seemingly innocent changes to the CSS could drastically change the page from the perspective of someone using the keyboard to navigate.
This is a great counter-argument, and seems applicable too when you have to build generic components to follow your own design system. Not using z-index would mean tying to implementation details (of how the markup appears) and making them less flexible.
Thanks for your insight - I thought there would be a valid use case for it, but couldn't think of anything to prove my colleague wrong when they thought z-index should never be used. Now that gives me some food for thought!
A follow-up question: do you know by any chance how z-index affects things like keyboard accessibility? For example, will elements with a higher z-index be reached first when navigating with keyboard tabbing?
I'm actually not sure. I suspect that higher
z-indexvalues will be earlier in the tab order, but only if they're explicitly called out (because tab order, unless overridden, normally follows markup order). Regardless, it's not something I would think you should rely on if it does, because then seemingly innocent changes to the CSS could drastically change the page from the perspective of someone using the keyboard to navigate.Preach! Educating myself on how to make the markup more accessible is going to be one of those ongoing goals of mine :)