Context Menus, @scope, and the State of Modern CSS

The first releases of 2026 are shaping up nicely. Firefox 147 and Chrome 144 both shipped this week, and while neither is bursting at the seams with new features, what did land is worth a closer look. CSS anchor positioning is now baseline, @scope is finally here, and developers are showing off some clever ways to use all these new capabilities.

Popover Context Menus Arrive (Finally)

Chris Coyier put together a detailed walkthrough on building context menus with the native Popover API and anchor positioning. The technique combines interest invokers, <menu> elements, discrete transitions, @starting-style, and fallback positions. It's a dense read, but worth it—anchor positioning officially went baseline this week, meaning it's ready for production use.

The timing is notable. Context menus have historically required JavaScript-heavy implementations or third-party libraries. With anchor positioning and native popovers, the browser handles the heavy lifting: positioning, accessibility, and dismissal behavior are all built in. Just don't ask us to name the CSS feature of the year yet.

Scoping CSS Without the Headaches

Firefox's final release of 2025 made @scope baseline, and the feature has been a long time coming. It solves a real problem: keeping styles contained to specific portions of the DOM without relying on naming conventions like BEM or nesting everything under verbose parent selectors.

Over at Frontend Masters, there's a solid how-to on using @scope and scoping CSS overall. For anyone who's spent years managing style bleed across large codebases, this is the feature to watch in 2026.

Gradient Borders from Image Sources

Ana Tudor posted a demo showing how to create offset gradient borders sourced from an image. The technique blurs an image and masks it with a border—Safari-only in three lines of CSS, but the cross-browser solution isn't much more complex. The key properties are backdrop-filter and mask.

It's a practical effect for anyone working with gradients, blurs, or the glass aesthetic that's everywhere right now. Worth studying even if you don't have an immediate use case—the pattern of combining filters with masking is reusable across projects.

Maybe You Don't Actually Need Tabs

HTML has come a long way, with new elements enabling interactive components without JavaScript. But Stephen Margheim has a hot take: tab components are over-engineered for 90 percent of use cases. His argument isn't that tabs are never necessary—it's that they're often the default choice when a simpler alternative would work better.

Before reaching for a tabbed interface, consider whether the content structure actually benefits from tabs or whether it's just a familiar pattern. Sometimes a simple list of sections or an accordion does the job with far less complexity.

The OS as a CMS

Jim Nielsen shared a creative approach to content management: making "Edit Post" buttons on his website open the local document in iA Writer. Instead of a web-based CMS, he uses a link with a custom URL scheme to jump directly into the file on his computer.

The concept extends beyond iA Writer. Many applications support their own URL schemes:

  • Obsidian: obsidian://open?vault=posts&file=post
  • VS Code: vscode://exact/path/to/post.md:9:1 (where :9:1 is line and column)
  • Ulysses: ulysses://x-callback-url/open-item?id=ITEM_ID
  • Sublime Text (with the subl protocol package): subl://exact/path/to/post.md:9:1
  • Apple Shortcuts: shortcuts://run-shortcut?name=Edit&input=/path/to/post.md (handy for apps without custom URL schemes)

It's a simple idea with big implications: if you're comfortable writing in Markdown, you can bypass the CMS entirely and keep your editing workflow local.

Quick Hits from the Week

A few smaller items worth bookmarking:

  • The HTML Document Outline is officially dead—it never really worked as intended.
  • Scroll-fade effects haven't died yet, but here's hoping they do.
  • An explainer on how !important works with CSS custom properties.
  • ReliCSS just shipped, offering a way to replace CSS hacks with @supports and modern CSS.
  • Temani Afif built a mini Mario World with CSS—keyboard controls, jumping, and all, in pure CSS with zero JavaScript.

New in Firefox and Chrome

Firefox 147 brings three features into Baseline territory: anchor positioning, view transition types, and the Navigation API (a JavaScript replacement for History API and window.location). Chrome 144 counters with ::search-text, a pseudo-element for styling find-in-page highlights; the <geolocation> element for declarative location requests; and the Temporal API, joining Firefox in modernizing JavaScript's date and time handling.