Responsive Gallery Thumbnails nehmen ganze Breite ein

  • Ich habe mit dem Firebug das CSS/HTML und mit dem Sublime das komplette Theme abgesucht, aber ich finde einfach den Grund nicht, wieso meine Galleries in der responsiven Ansicht (unter 768px Browserbreite/mobil) ihre Thumbnails auf 100% Breite bringen und untereinander stapeln. Ich hätte es gern so, dass die Zeilen/Spaltengleich bleiben bzw. maximal sich die Anzahl ändert.

    Hier zu bewundern, einfach Browser schmal ziehen.

    Hat jemand eine Idee?

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • füge mal dies in die style.css deines Themes

    Code
    .thumbnail {
        float: left;
        margin-left: 5px;
    }

    wenn dies an anderer Stelle Probleme macht, begrenze die Formatierung auf die Galerie

    also

    Code
    .gallery .thumbnail {
        float: left;
        margin-left: 5px;
    }
  • Danke! Sieht zumindest schonmal besser aus. Ich habe es mal nur in der media query für die schmalste Ansicht eingefügt und das passt so. Das floaten habe ich verstanden, aber wieso ist die .thumbnail vorher 100% breit geworden bzw. wieso auch nur in der mobile Ansicht? Ich habe an der Stelle jedenfalls auch keine Regel dafür gefunden.

    Was jetzt noch bleibt ist eine Verschiebung um einen Pixel (?) nach unten je Thumbnail von links nach rechts. Ich vermute es liegt irgendwie an der versteckten Caption, bekomme es aber auch nicht ausgemerzt.

    Edit: es lag an "min-height: 1px;" für alle Spalten des Grids. Ist mir dann wieder ein Rätsel, wieso das in der breiteren Ansicht nicht auftritt. Ich habe es jetzt gelöst, indem ich die min-height für alle .col-xx-yy innerhalb der .gallery-row auf 0 gesetzt habe. Klappt erstmal so und noch keine Fehler gefunden.

    Einmal editiert, zuletzt von moemoney (30. August 2014 um 12:12)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!