Rocksolid Columns Reihenfolge umkehren

[kubjo]

Hi Leute,
ich nutze die Erweiterung Rocksolid Columns. In der großen Ansicht ,auf dem Desktop, habe ich zwei Spalten nebeneinander. Links Bilder, rechts Text. Wenn ich jetzt den Viewport kleiner mache rutscht die rechte Spalte unter die Linke, das ist das normale Verhalten. Ich hätte aber gerne, dass in diesem Falle es gerade anders rum ist, und der Text über den Bildern steht. Ich weiß aber nicht, an welcher CSS Schraube ich da drehen muß! Kann mir da jemand helfen?

Grüße aus Ludwigsburg
JK

[mlweb]

Mit css-grid oder flexbox kannst Du die Reihenfolge prinzipiell anpassen.

[dazzle89]

Mit den Rocksolid Columns sollte das normalerweise nicht möglich sein. Es sei denn man schreibt das gesamte CSS um. Ich denke, dass du eigenes CSS (Flexbox oder grid) und Markup verwenden musst.

Für solche Fälle nutze ich zum Beispiel gerne die Rocksolid Custom Elements und gebe dem Bild und den Texten eigene CSS-Klassen. Wenn ich mit flexbox arbeite, ändere ich die Reihenfolge innerhalb eines Media Queries ganz einfach mit der CSS-Eigenschaft "order".

[mlweb]

Ja stimmt, man muss bei den Rocksolid-Columns etwas am Template und am css Schrauben, damit das alles funktioniert.

[Spooky]

Reicht da nicht einfach CSS Grid?

[mlweb]

Ich habe das mal für ein Theme von Rocksolid gemacht. Soweit ich mich erinnere, stimmt die "Verschachtelung" fürs css-grid nicht. Außerdem wollte ich, dass die volle Funktionalität im Backend erhalten bleibt (also Auswahl der entsprechenden Anzahl von Columns für die Ausgabe durch einen Redakteur).

Ich werde das mal übers Wochenende raussuchen und schauen, ob ich das allgemein zur Verfügung stellen kann. Damals ging es um die Anpassung eines konkreten Themes. Ich weiss jetzt ohne Testen nicht, ob meine Anpassungen auch dann richtig greifen, wenn nur die Erweiterung im Einsatz ist.

[Spooky]

Die Verschachtelung ist ja einfach nur

<div>
  <div>
    <!-- spalte 1 -->
  </div>
  <div>
    <!-- spalte 2 -->
  </div>
  <div>
    <!-- spalte 3 -->
  </div>
</div>

Damit kann man nicht mit CSS Grid arbeiten? Bin was CSS Grid anbelangt leider kein experte.

Mit flex könnte man die Reihenfolge aber auch einfach umdrehen.

[mlweb]

Hab gerade gefunden wie ich die notwendige Templateanpassung mit einem Anstupser von @Ausi erstellt habe. https://github.com/madeyourday/conta...ent-2269822398
Es geht dabei um die einzelnen Klassen für die Spaltenumschläge, damit auch alle Backendeinstellungen weiterhin so greifen, wie vorgesehen. Der Rest ist dann tatsächlich nur noch css.

[mlweb]

Damit kann man nicht mit CSS Grid arbeiten? Bin was CSS Grid anbelangt leider kein experte.

Mit flex könnte man die Reihenfolge aber auch einfach umdrehen.

Ja mit Flex könnte man auch arbeiten. Hatte ich auch geschrieben. Das eigentliche Problem war, dass ich die Einstellungen im Backend in Ihrer Funktionalität nicht außer Kraft setzen möchte.