Ich bin ein Frontend & UI Entwickler aus Bremen. Hier schreibe ich Artikel über Webentwicklung, Design, Software, Workflows und was mich sonst beschäftigt.

Du hast Anmerkungen und Feedback zu meinen Artikeln? Dann schreib mir! Ansonsten folgt mir auf Twitter und abonniert mich auf YouTube.

What’s the Deal with Margin Collapse?

jonathan-harrell.com / Direktlink

The concept of margin collapse is foundational to an understanding of the box model in CSS, but it is actually quite complex and potentially confusing. The spec describing how margin collapse works is thorough but difficult to understand. This article is an attempt to give some visual examples to the concepts from the specs.

The basic idea behind margin collapse is that if two margins are adjoining, they will collapse into one margin, which will have the greater of the two margin values (it will be the more negative of the margins if both margins are negative).

Designing Button States

cloudfour.com / Direktlink

Buttons are a staple of any design system. The best ones are simple, versatile, maybe even a little fun. But there’s a lot of hidden complexity in these jolly, candylike controls and toggles… complexity that’s easy to overlook when we focus on the same old default and hover states in our designs.
In truth, mouse effects are probably the least important state to design for. By accounting for more functional states early, you can lower the need for costly redesigns as your pattern library matures.

via @brad_frost

Modern CSS Explained For Dinosaurs

medium.com / Direktlink

CSS is strangely considered both one of the easiest and one of the hardest languages to learn as a web developer.

Peter Jang's sehr umfangreicher Artikel ist ein Geschichte, Tutorial und Überblick. Es fängt sehr einfach an und nimmt Fahrt auf. Unbedingt lesenswert - für jeden.

In order to deal with the inherent complexity of CSS, all sorts of different best practices have been established. The problem is that there isn’t any strong consensus on which best practices are in fact the best, and many of them seem to completely contradict each other. If you’re trying to learn CSS for the first time, this can be disorienting to say the least.
The goal of this article is to provide a historical context of how CSS approaches and tooling have evolved to what they are today in 2018. By understanding this history, it will be easier to understand each approach and how to use them to your benefit. Let’s get started!

Floats, Flexbox, CSS Grid, Preprozessoren, Variablen, OOCSS, BEM, SMACSS, Atomic CSS, CSSJS, u.v.m.
Ausserdem gibt es Dinosaurier Comics. Über CSS.