Debug/Inspect z-index stacking with the “CSS Stacking Context Inspector” DevTools extension

The Stacking Contexts Inspector is a DevTools extension for Google Chrome that allows you to analyse the stacking contexts available on a webpage. This extension will add a new panel to the DevTools and a new sidebar on the elements panel. Handy for when you’re having stacking issues. CSS Stacking Context Inspector →Stacking Contexts Inspector …

Smooth Scrolling and Find In Page, a not so Smooth Combination …

There was this interesting Twitter conversation last week between Chris Coyier and Schepp last week. Apparently if you have Smooth Scrolling enabled, it also affects the behavior of Find in Page in Chrome: Whenever you want to go to the next result it will smooth scroll, instead of jump to it. Anecdotal thing: when I …

Chrome is about to hide parts of the URL

In Chrome 86, we’re going to experiment with how URLs are shown in the address bar on desktop platforms. Our goal is to understand — through real-world usage — whether showing URLs this way helps users realize they’re visiting a malicious website, and protects them from phishing and social engineering attacks. A shame they didn’t …

New in Chrome 84

Chrome 84 has been released, which contains some nice additions. Pete LePage walks us through: Chrome 84 is rolling out now! Users can start common tasks within your app with App Icon Shortcuts. The Web Animations API adds support for a slew of previously unsupported features. Wake Lock, and the Content Indexing API graduate from …

How to enable HTTP3 in Chrome / Firefox / Safari

Mattias recently tweeted that his website can now be served over HTTP/3 “even though no browser supports it yet”. While it’s true that no browser supports it out of the box right now, there are options to enable HTTP/3. Here’s how. 🧪 As with all experimental technolgy/features: things might break! Be warned! ~ Google Chrome …

Chrome Extension Webpack Boilerplate

If you ever want to create a Chrome Extension, this repo might come in handy: A basic foundation boilerplate for rich Chrome Extensions using Webpack to help you write modular and modern Javascript code, load CSS easily and automatic reload the browser on code changes. Chrome Extension Webpack Boilerplate →

Conceal sensitive information in the Azure Portal with the “Azure Mask” browser extension

If you’re ever doing a livestream you might run into the problem that you’re about to expose sensitive information on your screen, such as UUIDs, emails, passwords, etc. For Azure Portal specifically there’s a browser extension called Azure Mask that does it all for you: This is a browser extension that will mask GUIDs (such …