Trick # 12 | Dieser Beitrag beinhaltet 454 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Das Blog-Modul in Divi zeigt die Bilder stets über dem Titel und dem Textauszug. Das gefällt nicht allen. Mit ein paar Zeilen CSS können Sie das Bild links oder rechts des Textes platzieren.
Wählen Sie – je nach Wunsch – einen der folgenden Codes und fügen sie ihn in Ihr CSS-Stylesheet unter Design/Customizer/Zusätzliches CSS ein.
Bild links – Text rechts
.et_pb_post a img {
height: 200px!important;
float: left;
width: 200px;
left: 0;
padding-right: 20px;}
@media only screen and (max-width: 980px) {
.et_pb_post a img {
float:none;
width:200px;
height:200px;}}Bild rechts – Text links
.et_pb_post a img {
height: 200px!important;
float: right;
width: 200px;
right: 0;
padding-left: 20px;}
@media only screen and (max-width: 980px) {
.et_pb_post a img {
float:none;
width:200px;
height:200px;}}Dieses Snippet gilt nur für die Darstellung «Volle Breite», nicht aber für «Gitter». Ersetzen Sie die Zahlenwerte bei width: und height: mit Ihrer gewünschten Bildgrösse.
Beide Codes haben nur einen Einfluss auf die Desktop-Ansicht. Auf mobilen Geräten bleibt das Bild über dem Text.
Werbung
Hin und wieder trifft Divi das Ankerziel nur so halbwegs und scrollt nicht ganz an die richtige Stelle der Webseite. Falls dies bei Ihrer WordPress-Site auch der Fall ist, empfehlen wir Ihnen diesen kleinen CSS-Hack.
Das Blogmodul des Divi-Themes ist «out of the box» nur so halbwegs hübsch anzusehen. Nachstylen ist auf jeden Fall gefragt. Besonders das Bild, welches in der Grid-Darstellung breiter ist als der darauf folgende Text, ärgert. Doch ein einziger ...
Der Standardfooter des Divi-Themes verfügt über eine Creditleiste. Deren Breite ist abhängig von der Breite der Website und wird stets mit den identischen Massen dargestellt. Falls Sie die Credit-Leiste selber definieren möchten, können Sie ...
Lust auf die etwas anderen Farben? Mit diesem kurzen Snippet können Sie die Farbe der Cursor-Hervorhebung auf Ihrer Divi-Website nach Belieben ändern.
Keine Inhalte gefunden.
Werbung
