"As a web developer, there is a high probability that you have encountered the two enemies of this article: images and deadlines. Sometimes, for some reasons, your images won’t fit the layout and you don’t want to wrap your head around this for hours."

CheatSheet for flex

CheatSheet for grid

"Due to recently disclosed security vulnerabilities for nearly all computers, you should disable any JavaScript cookie manipulation on your website (e.g. when using the critical CSS technique) by setting your cookies to be SameSite and HttpOnly on the server, as recommended on the Chromium wiki. Otherwise, sensitive data, like session keys, may be exposed to malicious third parties."

The next time you get something done with DevTools, ask yourself if it makes sense to automate it, and how much time this will save down-the-line.

What to expect in 2018?

• Always prefer classes
• Co-locate component code
• Use consistent class namespacing
• Maintain a strict mapping between namespaces and filenames
• Prevent leaking styles outside the component
• Prevent leaking styles inside the component
• Respect component boundaries
• Integrate external styles loosely

CSS animations are known to be super performant. Although this is the case for simple animations on a few elements, if you didn’t code your animations with performance in mind and add more complexity, website users will soon take notice and possibly get annoyed.

Critical extracts & inlines critical-path (above-the-fold) CSS from HTML

Grid Layout, Ecommerce Performance, and IphoneX

"Learn about selectors both new and old that you can use to style form inputs based on requirement, validity and more."

"La propriété CSS appearance permet de modifier la mise en forme native du système d'exploitation, et notamment d'annuler tous les styles de base pour pouvoir les re-styler tranquillement comme souhaité."