Bilder-Special – Trick #7: Bilder im Divi-Theme überlappend darstellen

Zwei oder mehr Bild-Module im Divi-Theme überlappen lassen? Kein Problem. Ein wenig CSS und gut ist. Wir zeigen Ihnen wie’s geht.

Erstellen Sie zunächst auf einer Divi-Seite eine zweispaltige Zeile und fügen Sie je ein Bildmodul ein. Sieht dann so aus:

Da überlappt zunächst mal gar nichts. Dieser Schritt kommt nun: Bearbeiten Sie das linke Bildmodul, wechseln Sie in den Tab «Erweitert» und klicken Sie auf «Benutzerdefinierte CSS». Dort sehen Sie das Feld «Hauptelement», in welches Sie den folgenden Code einfügen:

Nun bearbeiten Sie das rechte Bildmodul. Wieder unter «Erweitert» und «Benutzerdefinierte CSS» fügen Sie im Fenster «Hauptelement» den Code …

… ein. Das Ergebnis ist das folgende:

Natürlich werden Sie die Pixelwerte in den CSS-Codes anpassen müssen, bis die Anzeige bei Ihren Sujets stimmig ist. So lassen sich aber überlappende Bilder recht einfach darstellen.

Übrigens lassen sich auch Texte überlappend darstellen. Wie die geht, zeigen wir Ihnen im Beitrag «Zwei Textmodule überlappend darstellen».