Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.


Jackie Balzer is the head of front-end development at Behance, the world's leading online platform for showcasing and discovering creative work. She leads a team of front-end developers focusing on modular, scalable and reusable CSS with Sass and Compass, while bringing rich, complex designs to life with harmonious CSS and JavaScript. When not coding, she loves traveling, eating, and drinking outdoors.

Twitter: Follow Jackie Balzer on Twitter

Google Profile:

Sassy Z-Index Management For Complex Layouts

Z-index is an inherently tricky thing, and maintaining z-index order in a complex layout is notoriously difficult. With different stacking orders and contexts, keeping track of them as their numbers increase can be hard — and once they start to spread across CSS files, forget about it! Because z-index can make or break a UI element’s visibility and usability, keeping your website’s UI in working order can be a delicate balance.

Sassy Z-Index Management For Complex Layouts

Because z-index is contextual, once you start using it, requiring it for other elements as well is easy. Finding z-index: 99999 rules scattered throughout a website is not uncommon, but the infamous 99999 was born of frustration. It’s an easy way to get an element just to be on top of everything else. But it’s not entirely scalable: What if you need to add something on top of that?


↑ Back to top