Guten Tag! Guten Tag! 👋 

Are you struggling to understand why your anchor positioning doesn't work? Did you know that there's a window.stop() method? And did you ever wonder how to apply a theme color to Safari?

Turn on the Web Weekly tune and find some answers below. Enjoy!

Do you want to share your favorite song with the Web Weekly community? Hit reply; there are six more songs left in the queue.

A huge thank you and a huge bag of karma points go to Paweł, Johann, and Corey this week. Thank you for supporting indie publishing in the times of AI slop by covering a small fraction of the cost it takes to send Web Weekly every week! ❤️

If you enjoy Web Weekly, too, join 39 supporters on Patreon or GitHub Sponsors. It really makes a difference!

And if you learned something from this week's edition, share Web Weekly with your friends and family.

• 🦋 Bluesky
• 🐘 Mastodon
• 💼 LinkedIn

A quick "repost" really helps the newsletter out. Thank you! ❤️

No code 

• Don't Make Me Talk to Your Chatbot → "It's fine that people talk to chatbots, but they should not expect me to listen to theirs".
• Nobody Gets Promoted for Simplicity → "Nobody gets promoted for the complexity they avoided".

Heads up: Chrome will adopt a new release cycle 

Starting in September, Chrome will ship a new version every two weeks, and I already see these version numbers going through the roof. But honestly, more updates are a good thing.

Catch up

Do you remember theme-color? 

The theme-color meta element used to color Safari's frame and configure a color for progressive web apps.

Turns out, Safari dropped the theme color support for "normal" websites. And yet, sometimes the Safari frame is colored in website colors.

What is going on? Martin investigated Safari's behavior.

Color the Safari frame

Yes, this is a custom select! 

Disclaimer: customizable select elements are still a Chromium-only thing, but man, look at this beauty!

Select with style

: and = in style queries 

Style queries aren't supported in Firefox yet, so I must say that I didn't really play with them yet. But today I learned there's a difference between using : and =.

Whoot? Big thanks go to Temani for sharing yet another CSS pro tip!

Compare styles

Problems with anchor positioning 

I still haven't fully adopted anchor positioning, but I figured there are many edge cases, and sometimes I'm also just scratching my head. Temani covered many reasons why the anchors might not show up where you expect them to.

Master all these anchors

And if you want to see Chris rant a bit, he also talks about common anchor positioning mistakes.

Style restrictions of the new geolocation element 

And speaking of Chris, he also played with the new geolocation element (currently Chrome-only, and I covered it six weeks ago) and found some "interesting" CSS quirks of this new native element.

Style the location

The wonderful weird web – A map of us 

AMOU is a map of memories. People can share memories from a certain place. I've spent quite some time discovering all these unknown memories in my neighborhood. ❤️

Discover memories

npmx is having a moment 

I plugged npmx in a previous Web Weekly, and while I thought the project was cool, I secretly didn't have high hopes of me using it. But I do! And the team is building a nice community around the project. Good stuff!

Check packages with style

A CSS state machine 

Patrick tried to find a CSS-only way to store the information of whether an element was previously focused. The solution is hacky but also... elegant?

Remember focus

You Don't Know HTML Tables 

Frank claims that I don't know HTML tables, and turns out he's right. This is a massive read, but I'm sure you'll learn a thing or two. I mean, did you know that there's a TOM (table object model)?

Level up your table game

Creative ways to select :root 

Temani and Daniel get into an unofficial competition about unconventional ways to select the :root element and some of these approaches made me smile. I love CSS.

• The Hidden Selectors of The HTML Element
• The Different Ways to Select html in CSS

Random MDN – stop() 

From the unlimited MDN knowledge archive...

Here's a fun one: did you know that there's a global stop() method? Well, now you do!

Stop!

TIL recap – Overwrite your dependencies' dependencies 

Did you know that npm supports an overrides key in your package.json? If one of your dependencies is pulling in something nasty, you can fix the dependency right from the root level. Handy!

Fix your deps

New on the baseline — Trusted Types 

With Firefox 148 and Safari 26, Trusted Types entered the baseline! 🎉 What are they for?

Whenever you're dealing with user-generated content, you can enforce content to pass a sanitization step before injecting it into the DOM. You can enforce this via CSP, too. Pretty cool!

Be safe

Three valuable projects to have a look at 

• lokesh/color-thief – Grab the color palette from an image using just JavaScript. The demo site is pretty nice!
• searlsco/posse_party – Crossposting content from your site to a variety of social media platforms.
• webpro-nl/unbarrelify – Barrel file removal tool for JavaScript & TypeScript.

A new Tiny Helper 

I can't be the only person who tries to transform a png to an svg at least once a month. I played with this converter a bit, and the results looked promising.

Convert

Thought of the week 

Here's Matteo on everyone's "favorite" topic.

Did you learn something from this issue? 

❤️ If so, join 39 other Web Weekly supporters and give back with a small monthly donation on Patreon or GitHub Sponsors.

This is all, friends! 

Loved this email? Hated this email? I want to hear about it!

If you think something needs improvement or something sparked some joy, reply to this email because I want to know more!

And with that, take care of yourself - mentally, physically, and emotionally.

I'll see you next week! 👋

Join 6.5k+ developers and