{"id":16376156,"url":"https://github.com/felixfbecker/sourcegraph-css-stacking-contexts","last_synced_at":"2026-04-07T05:30:18.043Z","repository":{"id":46686827,"uuid":"351946966","full_name":"felixfbecker/sourcegraph-css-stacking-contexts","owner":"felixfbecker","description":"Sourcegraph extension to highlight CSS declarations that introduce new stacking contexts.","archived":false,"fork":false,"pushed_at":"2021-10-21T09:39:18.000Z","size":2037,"stargazers_count":1,"open_issues_count":0,"forks_count":2,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-01-01T08:17:26.215Z","etag":null,"topics":["sourcegraph-extension"],"latest_commit_sha":null,"homepage":"https://sourcegraph.com/extensions/felixfbecker/css-stacking-contexts","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/felixfbecker.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-03-27T00:37:34.000Z","updated_at":"2021-10-21T09:39:21.000Z","dependencies_parsed_at":"2022-08-26T07:10:56.342Z","dependency_job_id":null,"html_url":"https://github.com/felixfbecker/sourcegraph-css-stacking-contexts","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixfbecker%2Fsourcegraph-css-stacking-contexts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixfbecker%2Fsourcegraph-css-stacking-contexts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixfbecker%2Fsourcegraph-css-stacking-contexts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixfbecker%2Fsourcegraph-css-stacking-contexts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/felixfbecker","download_url":"https://codeload.github.com/felixfbecker/sourcegraph-css-stacking-contexts/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239970661,"owners_count":19727010,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["sourcegraph-extension"],"created_at":"2024-10-11T03:23:43.332Z","updated_at":"2026-04-07T05:30:17.983Z","avatar_url":"https://github.com/felixfbecker.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 💤 CSS Stacking Contexts Sourcegraph Extension\n\n\u003e The problem with z-index is that very few people understand how it really works. It’s not complicated, but it if you’ve never taken the time to read its specification, there are almost certainly crucial aspects that you’re completely unaware of.\n\u003e\n\u003e **The key to avoid getting tripped up is being able to spot when new stacking contexts are formed**. If you’re setting a z-index of a billion on an element and it’s not moving forward in the stacking order, take a look up its ancestor tree and see if any of its parents form stacking contexts. If they do, your z-index of a billion isn’t going to do you any good.\n\u003e\n\u003e \u003cfooter\u003e\n\u003e \u003ccite\u003e— \u003ca href=\"https://philipwalton.com/articles/what-no-one-told-you-about-z-index/\"\u003eWhat No One Told You About Z-Index\u003c/a\u003e, Philip Walton, Engineer @ Google\u003c/cite\u003e\n\u003e \u003c/footer\u003e\n\nThis extension makes [Stacking Contexts](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context) **visible** in CSS and SCSS, allowing you to write `z-index` declarations using small values _with confidence_.\n\n\u003cpicture\u003e\n\u003csource srcset=\"https://raw.githubusercontent.com/felixfbecker/sourcegraph-css-stacking-contexts/main/images/screenshot1.png\" media=\"(prefers-color-scheme: dark)\" /\u003e\n\u003csource srcset=\"https://raw.githubusercontent.com/felixfbecker/sourcegraph-css-stacking-contexts/main/images/screenshot1_light.png\" media=\"(prefers-color-scheme: light)\" /\u003e\n\u003cimg alt=\"Screenshot\" src=\"https://raw.githubusercontent.com/felixfbecker/sourcegraph-css-stacking-contexts/main/images/screenshot1_light.png\" /\u003e\n\u003c/picture\u003e\n\nAdditionally, it will tell you when a `z-index` declaration has no effect.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelixfbecker%2Fsourcegraph-css-stacking-contexts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffelixfbecker%2Fsourcegraph-css-stacking-contexts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelixfbecker%2Fsourcegraph-css-stacking-contexts/lists"}