Un guide avec des exemples interactifs sur l’utilisation et les propriétés de flexbox en CSS.

“Oftentimes, we wish that there was a way to avoid a certain CSS issue or behaviors from happening. You know, content is dynamic, and things can change on a web page, thus increasing the possibility of a CSS issue or a weird behavior.

Defensive CSS is a collection of snippets that can help you in writing CSS that is protected. In other words, you will have fewer issues in the future. If you follow my blog, you might read an article I wrote a while back which is called “The just in case mindset”. This is built upon it, and will be an ongoing list of snippets.”

“This is a book about the fundamentals of creating a good web interface. You will find out how to make effective forms, typography, grids, and many other components of web design.”

“Hover menus are inconsistent.“
Exemple de menu cliquable.

Petite bibliothèque de boutons pré-stylisés.

Extensions pour Firefox et Chrome de l'outil de test d'accessibilité « a11y.css » (prononcer Alix). En gros, il s'agit d'utiliser CSS pour révéler visuellement un certain nombre d'éléments incorrects ou à risque dans les pages.

‣ via Opquast

The Front-End Checklist Application is perfect for modern websites and meticulous developers!

Article intéressant sur comment gérer les images dont le lien est cassée.
Plutôt que le navigateur affiche le texte alternatif de façon habituelle, il est possible avec du CSS d'adapter le comportement en sachant que :
1. on peut typographiquement styler l’élément <img>, cela n’affectera pas l’image si elle s’affiche ;
2. L’élément <img> étant contrôlé par une source extérieure, les pseudo-éléments :before et :after ne peuvent pas fonctionner avec <img>. Cependant, lorsqu’une image ne s’affiche pas, et donc n’est pas chargée, ces pseudo-éléments peuvent apparaître.