Wenn es um Abstände von Texten oder Divs geht, dann handelt es sich hierbei meistens um Bestandteile des Boxmodells. Bestandteile des Boxmodells sind die Befehle “margin”, “padding”, und “border”. Diese Elemente Regeln Abstände innerhalb und ausserhalb eines Divs, ausgenommen hiervon ist border, dieser Befehl verschaft einem Div einen Rahmen, der für jede Seite des Divs seperat eingestellt werden kann. Um euch die Zusammenhänge zwischen Margin und Padding deutlich zu machen hier einmal das Boxmodell:

Margin sind die Abstände die außen ausserhalb des Divs bestehen und padding sind Abstände die innerhalb einer Div bestehen. Border hingegen ist der Rahmen des Divs selbst.

Jeder dieser Befehle hat noch zusätzliche Attribute wie left, right, top, und bottom. Diese Attribute steuern auf welcher Seite die jeweiligen Abstände bzw. der Rahmen erscheinen soll, werden sie nicht angegeben wird der jeweilige Pixelabstand für alle Seiten genutzt.

/* Hier einmal ein Beispiel für Margin:*/
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
 
/* Und hier Beispiele für Padding:*/
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
 
/* Und ein weiteres für Border:*/
border-top: 10px;
border-right: 10px;
border-bottom: 10px;
border-left: 10px;

Border hat hierbei noch weitere Attribute die die Eigenschaften des Rahmens einstellen.
Ein Beispiel hierfür ist:

border-bottom:1px solid #dadada;

Das “1px solid” dient der regulierung der Dicke des Rahmens, der Wert nach der # ist schlichtweg eine Farbangabe.