Inautilo1d ago

#Development #Previews
CSS typed arithmetic · “This single feature is a quiet revolution.” https://ilo.im/1674t5

_____
#ModernCSS #CssCalc #Calculations #Layouts #Animations #Browser #WebDev #Frontend #CSS

CSS Typed Arithmetic | CSS-Tricks

Starting in Chrome 140, we'll be able to calculate numeric values with mixed data types. Sounds small, but Amit demonstrates how big a deal this is, calling it Computational CSS.

CSS-Tricks
InautiloSep 25

#Development #Techniques
Custom properties in media queries? · A workaround powered by modern CSS https://ilo.im/1675st

_____
#ModernCSS #MediaQueries #ContainerQueries #StyleQueries #CustomProperties #Browser #WebDev #Frontend #CSS

A workaround for using custom properties in media queries

One of the most frustrating aspects of media queries is that we can’t use custom properties with them. This often results in hard-coded values in otherwise, highly configurable codebases. Manuel has a novel approach to get around this.

Piccalilli
InautiloSep 23

#Development #Approaches
The double focus ring problem · A smart solution built with modern CSS https://ilo.im/166zfq

_____
#ModernCSS #Themes #Accessibility #Keyboard #FocusRing #CustomProperties #WebDev #Frontend #HTML #CSS

Taking a shot at the double focus ring problem using modern CSS

A double focus ring is really useful in general but especially so with complex, themed systems. Eric Bailey shows us how to develop a really smart system, using modern CSS.

Piccalilli
InautiloSep 20

#Development #Approaches
This website has no class · Zen gardening with modern HTML/CSS https://ilo.im/166xej

_____
#ModernCSS #CssZenGarden #Website #Browser #WebComponents #WebDev #Frontend #HTML #CSS

This website has no class | Adam Stoddard

Going “full CSS Zen Garden” with modern CSS.

InautiloSep 20

#Development
What to know about modern CSS in 2025 · There is more this year than there was last https://ilo.im/16711o

_____
#ModernCSS #BrowserSupport #ProgressiveEnhancement #Polyfill #Browser #WebDev #Frontend #HTML #CSS #JavaScript

What You Need to Know about Modern CSS (2025 Edition) – Frontend Masters Blog

If you thought 2024 was packed with amazing new CSS, well, you're right. But so is 2025 and it keeps looking bright. Check out our list of the best stuff with easy-to-reference examples.

InautiloSep 18

#Development #Previews
CSS :heading and :heading() · Styling headings is about to get much easier https://ilo.im/166xa6

_____
#ModernCSS #Styling #Headings #Firefox #Browser #WebDev #Frontend #HTML #CSS

CSS :heading

Interactive article about the :heading pseudo-class and function

InautiloSep 10

#Development #Updates
The Learn CSS course is updated · Fresh lessons cover the latest CSS features https://ilo.im/166rc2

_____
#ModernCSS #Baseline #Browser #WebDev #Frontend #CSS

A refresh of Learn CSS with nine new modules  |  Blog  |  web.dev

Our popular Learn CSS course has been updated with new modules covering the latest CSS features.

web.dev
InautiloSep 2

#Development #Overviews
You no longer need JavaScript · An overview of what makes modern CSS so awesome https://ilo.im/166h9e

_____
#ModernCSS #Baseline #Browser #WebDev #Frontend #CSS #HTML #JavaScript

You no longer need JavaScript

An overview of what makes modern CSS so awesome.

lyra's epic blog
InautiloAug 28

#Development #Guides
The basics of anchor positioning · An interactive guide to an exciting CSS feature https://ilo.im/166gee

_____
#ModernCSS #Layout #Positioning #AnchorPositioning #Chrome #Browser #WebDev #Frontend #CSS

The Basics of Anchor Positioning

Learn the basics of Anchor Positioning in CSS

Nouvelle-Techno.frAug 23

CSS peut maintenant cibler un parent selon ses enfants, grâce au sélecteur :has() :

✅ Fonctionne dans Chrome, Safari, Edge… et même Firefox 121+.

🎥 Démo rapide : https://youtube.com/shorts/iTFiNbKoIVI

#CSS #frontend #moderncss #webdev

Before you continue to YouTube