L'arrivée de display: grid-lanes marque une étape clé dans la maturité des modules de mise en page CSS. En combinant la rigueur d'un axe dimensionnel hérité de CSS Grid avec la flexibilité d'un empilement organique, cette évolution comble un manque historique sans sacrifier les impératifs d'accessibilité grâce au renfort de reading-flow et flow-tolerance.
À ce jour, cette fonctionnalité demeure expérientale. Elle est à tester sous couvert de flags navigateurs ou via l'amélioration progressive. Le CSS moderne continue de remplacer avantageusement les scripts lourds d'autrefois pour notre plus grand confort… et celui de nos utilisateurs !
Masonry pure CSS et accessibilité sont dans un bateau...
Méthode masonry pure CSS pour fin 2026 (avec solution de replis)
TLDR; contrast-color() takes any color and returns either black or white, whichever provides the highest contrast against the input color.
Ce qu'on peut faire en 2026 avec des CSS est fantastique !
De bonnes explications avec en plus de l'accessibilité
<marquee> en CSS et js accessible
La stylisation des SVG avec CSS offre de nombreuses possibilités créatives, mais nécessite de comprendre les différences entre les méthodes d'intégration. En choisissant l'approche adaptée à vos besoins spécifiques et en suivant les bonnes pratiques, vous pouvez créer des graphiques vectoriels attrayants, accessibles et parfaitement intégrés à votre interface utilisateur.
This tool will convert an SVG shape created with <path d="..."> into a CSS Shape. You will get a responsive code made with the new shape() function of clip-path.
A single-element implementation that works with images and supports gradient coloration!
Le Grall de l'animation CSS : faire passer un élément de display none height 0 à sa taille normale visible.
Une explication très claire et pédagogique des grid CSS
Un diagramme très complet (et complexe) pour décider quelle unité utiliser en CSS.
Because overflow: hidden creates a scroll container it can interfere with the Scroll-Driven Animations scroller lookup mechanism. The fix is to use overflow: clip instead.
Un article très didactique sur le superpouvoir de :has en CSS
Le format SVG peut paraître parfois un peu intimidant, et l'associer à des transitions ou des animations CSS semble encore plus audacieux pour bon nombre de personnes.
Cependant, dans certains cas, l'alchimie entre SVG et CSS est aussi bénéfique qu'extrêmement simple à mettre en oeuvre. Dans ce tutoriel, nous allons suivre étape par étape comment animer un bouton burger simple avec SVG et CSS.
Un tutoriel sur les grid en CSS (très bien fait !)
Une centaines de rubans en CSS
To feature detect browser support for the CSS :has() selector, you can use @supports(selector(…)). When doing so, it is important to include a valid selector as its argument. As I’ve tweeted before, you must pass a selector such as * into :has() when used in a feature query.
The scroll-padding-top property
The scroll-padding-top property is applied to the parent container and acts just like a CSS top padding, defining offsets from the top of the scrolling area.
scroll-padding-top: <value>;
Copy
You can use any px, em, rem, vh, %, etc. value, as well as auto, where the user agent determines the offset as 0px.
Un article de fond sur Oklch et une gestion moderne des couleurs en CSS.