Padding, margins en block-/column grootte

Padding en margins hebben de neiging om veel mensen in verwarring te brengen, omdat ze naar hetzelfde lijken te verwijzen. Ze hebben allebei te maken met het plaatsen van de 'witte ruimte' rond en tussen elementen. Dit is het verschil:

Padding

Padding is de witte ruimte tussen de buitenste rand (border) van een block of column en de inhoud erin. Door meer padding toe te voegen, verschuift de content naar het midden van het block of de column. Je kan de padding voor alle vier zijden van je block of column afzonderlijk aanpassen.


Tip: naast de padding rond je content, kun je ook de positionering van inhoud binnen elke column instellen. Je stelt de positie (boven, midden of onderkant) in bij Column> Settings> Alignment.


Margin

Margin is de ruimte tussen de buitenrand van een element en de buitenrand van het aangrenzende element in het block of de column.


Door de margin in te stellen, kun je de afstand tussen twee elementen binnen een block of column aanpassen. Een voorbeeld van margins is de ruimte tussen de titel en de ondertitel elementen.

Block/Column grootte

Blocks hebben een standaardhoogte en Columns hebben een standaardbreedte wanneer je ze maakt, maar je kunt de hoogte van een block of breedte van een column eenvoudig wijzigen. Aan de onderkant van een block zie je een wit vierkant handvat met een dunne paarse rand. Sleep de hendel omhoog of omlaag om de hoogte van het block te wijzigen. Aan de zijkanten van je columns zie je een handvat met een dunne oranje rand. Sleep de greep van links naar rechts om de breedte van een column te wijzigen.