Archives

Ein tiefgehender Blick auf die CSS-Cascade. Origins, Importance, Spezifität und Reihenfolge und wie sie in realen Projekten über die Stabilität deiner Styles entscheiden.

Warum Spezifität einer der wichtigsten Mechanismen in CSS ist, wie man sie kontrolliert und wie typische Probleme in großen Codebases entstehen.

Warum moderne CSS-Selektoren wie :is(), :where() und :has() zu den wichtigsten Werkzeugen moderner UI-Architekturen gehören und wie sie in realen Codebases den Alltag erleichtern.

Warum jedes Layout im Box-Modell beginnt, wie Content-, Padding-, Border- und Margin-Box zusammenwirken und welche typischen Probleme in realen Projekten entstehen.

Flexbox richtig verstehen. Die zentralen Prinzipien, typische Stolpersteine aus realen Projekten und solide Basis-Patterns, die jede moderne UI braucht.

Die wichtigsten Flexbox-Patterns für den Alltag. Von perfektem Zentrieren über Holy-Grail-Layouts bis zu responsiven Komponenten, die sich vorhersehbar verhalten.

Ein fundierter Einstieg in CSS Grid. Warum es ein Paradigmenwechsel ist, wie Tracks funktionieren und welche Grundmuster man unbedingt verstehen sollte.

Die mächtigsten Grid-Features minmax(), auto-fit, auto-fill, Auto-Placement und fr-basierte Logik verständlich erklärt.

Container Queries gehören zu den bedeutendsten Fortschritten in CSS. Dieses Türchen erklärt, wie sie funktionieren, warum sie responsives Design grundlegend verändern und wie man sie in realen Codebases einsetzt.

Moderne Responsive-Design-Techniken ohne harte Breakpoints, fluides Scaling, clamp(), moderne Einheiten und wie man ein flexibles, robustes Designsystem entwickelt.

CSS Custom Properties sind mehr als nur Variablen. Sie sind ein dynamisches, zur Laufzeit auflösendes System, das moderne Designsysteme, Theming und flexible Komponenten erst wirklich möglich macht.

Moderne CSS-Selektoren wie :has(), :checked oder :target ermöglichen Interaktivität ohne JavaScript. Dieses Türchen zeigt praxisnahe Einsatzmöglichkeiten und typische Pattern moderner UI-Komponenten.

Ein praxisnaher Vergleich der wichtigsten CSS-Architekturansätze – BEM, ITCSS und CUBE CSS – und wie sie dabei helfen, Codebases langfristig wartbar und skalierbar zu machen.

Cascade Layers bringen Ordnung in große Codebases. Dieses Türchen erklärt, wie @layer funktioniert, warum es Spezifitätskonflikte verhindert und wie man Layers in professionellen Projekten strukturiert nutzt.

Moderne Webtypografie geht weit über Schriftgrößen hinaus. In diesem Türchen geht es um fluides Scaling, line-height-Systeme, Variablen, Schriftachsen, Lesbarkeit und den Aufbau konsistenter typografischer Systeme.

Variable Fonts verändern, wie wir Typografie im Web denken. Dieses Türchen zeigt, wie sie funktionieren, warum sie performanter sind und welche kreativen wie systemischen Möglichkeiten sie eröffnen.