# 053: Responsive Columns für die Galerie - CSS-Tricks

Inhaltsverzeichnis

Wir fügen dem Raster, das wir für die Galerie eingerichtet haben, eine gewisse Reaktionsfähigkeit hinzu. Auf den breitesten Bildschirmen haben wir es auf vier Spalten eingestellt. Dann fügen wir über unsere supereinfachen @ mixins, die wir eingerichtet und überall wiederverwendet haben, Haltepunkte hinzu.

An unserem Mutter-Bär-Haltepunkt gehen wir zu 3 Spalten hinunter, dann machen wir einen Zwischen-Haltepunkt zwischen Mama-Bär und Baby-Bär, wo er in 2 Spalten zerfällt, dann letztendlich 1 Spalte bei Baby-Bär. Dies ist sehr einfach, da wir nur die Anzahl der Spalten anpassen müssen, die wir über CSS3 festlegen column-count.

Wir beenden das Video und sprechen über zukünftige Ziele für die Galerie. Es wäre schön, eine unterschiedliche Anzahl von Bildern auf unterschiedlichen Bildschirmgrößen laden zu können und anstelle von Bildern in voller Größe tatsächliche Miniaturansichten zu verwenden. Vielleicht kommen wir eines Tages dorthin.

Die Software, die ich lokal verwende, um Screenshots aufzunehmen und über FTP auf den Server hochzuladen, ist LittleSnapper.

Interessante Beiträge...