Issue #577

February 6, 2024

Highlight Text When a User Scrolls Down to That Piece of Text

Chris Coyier shows how to highlight a line of text once you scroll to it using only CSS.

Brecht De Ruyte covers the basics of web components.

Tired of unclear bug reports?

Marker.io adds context to every bug report with URL, screenshots, environment info, session replay, and much more. Go from “To Do” to “Resolved” 10x faster.

Try it now →

▶ VS Code Tips — Custom Folding Ranges #vscode

A short guide on creating Manual Folding Ranges in Visual Studio Code that allow you to collapse and expand (fold and unfold) any part of your code.

Watch video

Articles & Tutorials

Build an off-canvas menu with and web components

Mark Conroy demonstrates how to create an accessible off-canvas menu using web components and the

element.

Lossy CSS Compression for Fun and Loss (or Profit)

Daniel Janus wrote cssfact, a lossy CSS compressor that takes some CSS and outputs back CSS that contains fewer rules.

When To Use The Min() Or Max() Function

Temani Afif explains when you should use min() and max() functions.

The web just gets better with Interop 2024

Jen Simmons outlines the focus areas of Interop 2024.

Big, beautiful, beefy focus states with :focus-visible

Dave Rupert shows how to use :focus-visible pseudo-state to create bigger, bolder, and more obvious focus states for your keyboard users.

Google and Yahoo Email Updates 2024: What's Changed?

If you send more than 5K emails a day, check Mailtrap’s tutorial on the new ‘Google and Yahoo email policy 2024’. It breaks down the latest authentication and DNS protocol requirements, so you can navigate them with ease.

Explore a Detailed Overview of the Updates