Author:

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: https://plus.google.com/112400511055536345206/posts

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?

Read more...
1

↑ Back to top