Programmiererforum

.grid {
display: grid;
grid-template-columns: 2, 1fr);
grid-template-rows: masonry;
grid-auto-flow: dense;
/* align-tracks: stretch; */
}

Ich versuche, eine Bildergalerie für Mauerwerksgitter zu erstellen. Die Bilder werden in einer Schleife aus einem Array erstellt und ich möchte breitere Bilder erstellen, um beide Spalten des Rasters zu erweitern.

Das möchte ich erreichen:
Das Ergebnis, das ich erreichen möchte
Eigentlich nutze ich Rückenwind zur Vereinfachung, aber ich kann etwas benutzerdefiniertes CSS verwenden, um es zu vervollständigen.
[code]




[/code]
Jetzt gibt es eine Version mit nur Spalten und ich habe von anderen Rasteroptionen wie dieser erfahren:
[code].grid {
display: grid;
grid-template-columns: 2, 1fr);
grid-template-rows: masonry;
grid-auto-flow: dense;
/* align-tracks: stretch; */
}
[/code]
aber ich finde keine Möglichkeit, die Spalten nur für breitere Bilder, die sich über zwei Spalten erstrecken, dynamisch zu ändern