Nützliche 1-Zeilen-CSS-Layouts

• Super Centered { place-items: center }

• The Deconstructed Pancake { flex: 0 1 }

• Sidebar Says { grid-template-columns: minmax(, ) ... }

• Pancake Stack { grid-template-rows: auto 1fr auto }

• Klassisches Holy-Grail-Layout { grid-template: auto 1fr auto / auto 1fr auto }

• 12-Spalten-Grid { grid-template-columns: repeat(12, 1fr) }

• RAM (Repeat, Auto, Minmax) { grid-template-columns: repeat(auto-fit, minmax(, 1fr)) }

• Alles auf einer Linie { justify-content: space-between }

• Clamping My Style { clamp(, , ) }

• Seitenverhältnis respektieren { aspect-ratio: / }

[xguru]

Ganz in einer einzigen Zeile ist es zwar nicht, aber es wirkt nützlich.