Mit dem sog. Masonry-Layout können Inhalte wie Bilder oder Card-Elemente ansprechend und platzsparend auf einer Website angezeigt werden. Im Gegensatz zu »klassischen Rastern« zeichnet es sich durch eine versetzte Kachel-Optik aus – daher auch der Name (Masonry = Mauerwerk). Aus technischer Sicht ist das echte Masonry-Layout nicht einfach umsetzbar – zumindest nicht ohne JavaScript und wenn es responsive sein soll. Wir stellen die verschiedenen Lösungen vor; u. a. auch eine sich abzeichnende native CSS-Lösung mittels CSS Grid.

Beitrag zu Ende lesen