Was sind eigentlich Innen- und Außenabstände in Divi?

Eine tolle Möglichkeit bei dem Theme DIVI* ist die Designanpassung eines jeden Moduls, einer jeden Zeile und Sektion. Eine Anpassungsmöglichkeit, die ich selber häufig verwende und daher auch gerne in meinen Kursen zeige, ist der „Zwischenraum“. Du findest diese Einstellung unter den jeweiligen „Moduleinstellungen“ (das Zahnrad), „Design“ und „Zwischenraum“.

Der Zwischenraum bestimmt die Innen- und Außenabstände in DIVI (Margin und  Padding).

Für mich ist diese Einstellungsmöglichkeit total hilfreich und wichtig.

Daher möchte ich dir heute noch einmal bildlich zeigen, was genau du damit definieren kannst. Denn ich erinnere mich noch sehr gut an meine Anfangszeit mit DIVI. Wie oft bin ich genau hier verzweifelt, weil ich nicht mehr wusste, welche Eingaben man an welcher Stelle machen muss und welche Auswirkungen das jeweils hat…! Damit dir das nicht passiert, erläutere ich dir in diesem Beitrag die Unterschiede und gebe dir zusätzlich noch ein paar Tipps mit auf den Weg.

Was sind noch einmal die Innen- und was die Außenabstände?

Innen- und Außenabstände in DIVI

Die Außenabstände definieren den Abstand rund um ein Modul im Außen und die Innenabstände definieren den Abstand innerhalb des Moduls zu dem Inhalt.

Ok, ich weiß selber, dass das kryptisch klingt und dir an der Stelle noch nicht wirklich weiterhilft. Daher demonstriere ich es anhand von Beispielen:

 

 

1. Der Außenabstand

Innen-und-außenabstaende-in-DIVI

Erläuterung:

Ich habe in diesem Beispiel zwei Textfelder angelegt. Beide haben zur besseren Erkennbarkeit einen gelben Hintergrund. Die grauen Hintergründe sind nur dafür da, um die Sektion zu kennzeichnen.

Im oberen Textfeld habe ich keinerlei Design-Einstellungen vorgenommen. Die Abstände innerhalb des Textfeldes, d.h. vom gelben Kasten zum Text hin sowie die Außenabstände, (d.h. der Abstand rund um den gelben Kasten) sind standardmäßig vorgegeben.

In dem unteren Textfeld habe ich zum Vergleich unter den Einstellungen „Design“ – „Zwischenraum“ jeweils 30 px Außenabstand (Margin) angegeben.

Was passiert?

Der Abstand rund um das gelbe Feld vergrößert sich. Das ist der Außenabstand links und rechts (s. Grafik oben). So wird das gelbe Feld also schmaler und der Text bricht anders um. Außerdem vergrößert sich der Platz innerhalb der Sektion, also nach oben und unten, entsprechend.

2. Der Innenabstand:

Erläuterung:

In diesem Beispiel habe ich darunter ein weiteres Textfeld eingefügt. Hier ist nun der Innenabstand auf jeweils 30 px eingestellt. Der Außenabstand wurde zurückgesetzt.

Was passiert?

Der Abstand innerhalb des Textmodules, also rund um den Text, wurde vergrößert. Man kann sich das so vorstellen, dass sich der Innenabstand wie eine Art Polsterung (= Padding) auswirkt. So plustert sich das Modul um den Text wie ein Polster auf, und zwar um 30 px zu allen Rändern. Auf diese Weise kann man schöne, farbige Textboxen gestalten, an denen der Text nicht direkt an den Außenrändern klebt, wie in der obersten Variante.

Hier noch einmal alle drei Varianten in der Übersicht:

Oben: Standardeinstellungen
Mitte: Alle Außenabstände auf 30 px
Unten: Alle Innenabstände auf 30 px

innen- und außenabstaende in divi

Zwei kreative Gestaltungsbeispiele:

Treppe:

Hier habe ich eine Zeile mit 3 Spalten eingefügt. In jeder Spalte ist ein Bild. Im mittleren Bildmodul ist der Außenabstand oben auf 70 px gesetzt.

Überlappende Bilder:

Ergänzend zu der Treppe habe ich bei jedem Bild-Modul zusätzlich den Außenabstand rechts auf -100 px. gesetzt. Das ist also ein negativer Abstand. Dadurch verringert sich der Abstand des Bildes zum jeweils rechten Bild um -100 px. So schafft man ein Überlappungseffekt.

Ich hoffe, dass es nun etwas deutlicher ist, wofür man die Innen- und Außenabstände in Divi nutzen kann. Probiere doch auch einmal aus, was alles mglich ist! Ich erstelle mir dafür immer eine „Bastelseite“, die ich nicht veröffentliche.

Kennst du eigentlich schon meine Facebook-Gruppe „Für selbstständige Frauen: Webdesign, Grafik & Marketing leicht gemacht!“?

Wenn nicht, schau doch mal vorbei. Hier kannst du mir gerne Fragen stellen oder dich mit anderen selbstständigen Frauen austauschen! Du könntest hier auch gerne mal deine Bastel-Ergebnisse einstellen. 🙂

 

* Affiliate-Link

Hi, ich bin Sarah.

Als Mentorin für Online-Business-Starterinnen unterstütze ich Frauen wie dich dabei, ein Online-Business aufzubauen, welches 100%ig zu dir passt!

Damit du starten kannst, das freie, selbstbestimmte und erfolgreiche Leben zu führen, welches du dir schon lange wünschst!

Bei mir geht es nicht darum, in kürzester Zeit ein 6- oder 7-stelliges Mega-Business aus dem Boden zu stampfen. Es geht darum, genau den Business-Weg zu finden, der zu dir passt und deiner eigenen Vision zu folgen. Sehr individuell und mit Achtsamkeit.

Ich bin der Überzeugung, dass du mit deinem Business langfristig glücklich und erfolgreich sein wirst, wenn du es optimal auf dich & deine Bedürfnisse ausrichtest.

Liebe Grüße,
Sarah

 

Sarah Gernhöfer – Reichweite aufbauen