Problem mit Galerie und float left

Hallo zusammen,

hier meine Konfiguration:
Classic Editor
Theme Blocksy
CSS ergänzt, damit Bilder nebeneinander erscheinen

Ohne die CSS-Ergänzung im Customizer sind alle Bilder ohne Abstand untereinander angeordnet. Im Dashboard werden die Bilder nebeneinander angezeigt. Nach Eingabe dieser CSS sind die Bilder auch im Frontend nebeneinander:

/* Bilder in Galerie nebeneinander */
.gallery .gallery-item {
    float: left;
    padding: 10px;
}

Wenn ich nach der Galerie Text eingebe, hängt dieser oben rechts neben einem Bild und nicht wie gewünscht unter der Galerie. Wie kann ich das ändern?
Hier der Link zum Ansehen (Gültig 6 Tage):
https://distinctants.s3-tastewp.com/galerie/

Danke für einen guten Tipp!

Die Sache mit clear hatte ich schon gelesen, aber die Änderung nicht hinbekommen. Wie kann ich das in meinen CSS-Code einbauen? Es betrifft ja nur Seiten, welche die WP-Galerie enthalten.

Ich muss passen und bekomme es mit meinen Kenntnissen leider nicht hin. Ich konnte wie oben gezeigt nur die Ausrichtung der Bilder in der Galerie ändern. Wie ich jetzt zusätzlich die Klasse clearfix der Galerie zuweisen soll, weiß ich nicht. Eine längere Suche im Netz hat mich auch nicht weiter gebracht. Schade.

Zitat von b3317133

Am Rande bemerkt, derzeit verwendest Du auf dem Beispielserver offenbar ein Block Theme aber keinen zugehörigen Galerie Block, das passt nicht zusammen. Verwende ein passendes älteres Theme ohne Blöcke wenn Du den Classic Editor nutzt.

Das Theme "Blocksy" wird als Vorlage für zahlreiche User einer Gruppe mit geringen Kenntnissen (Senioren) verwendet. Mit dem Blockeditor kommen sie nicht klar. Bisher konnte ich alle Funktionen mit diesem Theme auch ohne den Block Editor realisieren. Bei der Galerie klappt es wie bekannt leider nicht, so dass nur die ungeliebten Tabellen bleiben.

Zitat von threadi

In dem Fall ist clear auch eine ungünstige Lösung. Richtig wäre:

Code

.gallery { overflow: hidden; }

Das funktioniert leider nicht. Der nachfolgende Text hängt weiterhin oben rechts auf der Seite.

Zitat von threadi

Wo hast Du das hingeschrieben? Unter dem Link seh ich es nicht.

Sorry. Hatte es auf einer lokalen Installation getestet. Jetzt hier eingetragen mit:

.gallery {
    overflow: hidden;
}

https://distinctants.s3-tastewp.com/galerie/

Geht leider nicht. Ohne float sind die Bilder wieder untereinander.

Mit deiner Ergänzung

.gallery .gallery-item {
    float: left;
    padding: 10px;
      overflow: hidden;
}

sieht es aus wie zu Beginn.

Habe jetzt diesen Code eingegeben:

.gallery-item {
    float: left;
    padding: 10px;
}
.gallery {
      overflow: hidden;
}

Wenn mich nicht alles täuscht, funktioniert es jetzt. Bitte mal ansehen. Danke.

OK. Problem gelöst. Mein Fehler lag darin, dass ich beide Klassen zusammengefasst hatte.
Danke an Alle für die Hilfe!

Hinweis:
Laut Provider "TasteWP.com" gibt es eine Google-Warnung für die Domain "S3-tasetewp.com". Die hier im Beitrag verwendete Testdomain wurde gelöscht und Google informiert. Bitte den Link nicht mehr aufrufen!

@Admins:
Könnt ihr den Link bitte sicherheitshalber entfernen?
Danke.