1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Problem mit Galerie und float left

Dieses Thema im Forum "Design" wurde erstellt von m266, 24. Mai 2022.

Schlagworte:
  1. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    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:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    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!

    Galerie Text nicht unterhalb.png Galerie Dashboard.png Galerie Frontend.png
     
  2. b3317133

    b3317133 Well-Known Member

    Registriert seit:
    21. November 2014
    Beiträge:
    11.638
    Zustimmungen:
    1.778
    Wenn Du float verwendest, brauchst Du am Ende der "floatenden" Elemente eine Aufhebung davon bzw. ein clear, siehe z.B. hier.

    Mit WordPress hat das Problem nichts zu tun, das sind allgemeine CSS Grundlagen.
     
  3. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    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.
     
  4. b3317133

    b3317133 Well-Known Member

    Registriert seit:
    21. November 2014
    Beiträge:
    11.638
    Zustimmungen:
    1.778
    Verwende das im o.g. Link auf der Seite zu clear angegebene new, modern clearfix hack Beispiel und füge Deiner Galerie die Klasse clearfix hinzu.

    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.
     
  5. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    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.

    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.
     
  6. threadi

    threadi Well-Known Member

    Registriert seit:
    9. Oktober 2020
    Beiträge:
    1.967
    Zustimmungen:
    397
    In dem Fall ist clear auch eine ungünstige Lösung. Richtig wäre:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Allerdings würde ich empfehlen, wenn Du schon Bilder nebeneinander anordnest, das evtl. per Flexbox zu machen. Damit kannst Du die Anordnung viel besser handhaben: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
     
  7. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    Das funktioniert leider nicht. Der nachfolgende Text hängt weiterhin oben rechts auf der Seite.
     
  8. threadi

    threadi Well-Known Member

    Registriert seit:
    9. Oktober 2020
    Beiträge:
    1.967
    Zustimmungen:
    397
    Wo hast Du das hingeschrieben? Unter dem Link seh ich es nicht.
     
  9. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    Sorry. Hatte es auf einer lokalen Installation getestet. Jetzt hier eingetragen mit:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    https://distinctants.s3-tastewp.com/galerie/
     
  10. threadi

    threadi Well-Known Member

    Registriert seit:
    9. Oktober 2020
    Beiträge:
    1.967
    Zustimmungen:
    397
    Geht doch. Jetzt haste aber auch das floating entfernt ..
     
  11. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    Geht leider nicht. Ohne float sind die Bilder wieder untereinander.

    Mit deiner Ergänzung
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    sieht es aus wie zu Beginn.
     
  12. threadi

    threadi Well-Known Member

    Registriert seit:
    9. Oktober 2020
    Beiträge:
    1.967
    Zustimmungen:
    397
    Schau dir mal genau an was Du da schreibst. Das floating wirkt sich auf die gallery-items aus während meine Empfehlung sich auf das umgebende gallery auswirkt. Wenn Du das mal richtig zusammensetzt funktioniert es auch. Ansonsten würde ich dir empfehlen mal CSS-Grundlagen zu Selektoren anzuschauen: https://wiki.selfhtml.org/wiki/CSS/Selektoren
     
    m266 gefällt das.
  13. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    Habe jetzt diesen Code eingegeben:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Wenn mich nicht alles täuscht, funktioniert es jetzt. Bitte mal ansehen. Danke.
     
    threadi gefällt das.
  14. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    OK. Problem gelöst. Mein Fehler lag darin, dass ich beide Klassen zusammengefasst hatte.
    Danke an Alle für die Hilfe!
     
  15. m266

    m266 Well-Known Member

    Registriert seit:
    21. April 2010
    Beiträge:
    575
    Zustimmungen:
    12
    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.
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden