Hoe pas ik de hoogte, ruimte en breedte van een sectie aan?

Minimale hoogte instellen

1. Selecteer de sectie en open rechts het paneel Afmeting instellingen.
2. Vink Minimale hoogte instellen aan.
3. Kies bij Hoogte unit voor Pixels (px) of View Height (vh).
4. Stel met de schuifregelaar Minimale hoogte de hoogte in: in pixels tot 1500, in vh tot 100.

Het is een minimale hoogte: past de inhoud er niet in, dan wordt de sectie vanzelf hoger.

Pixels of View Height (vh)

Met pixels is de sectie op elk scherm even hoog, bijvoorbeeld 600 px. Met vh rekent de sectie mee met de hoogte van het scherm: 100 vh is het hele scherm, 85 vh is 85% ervan. Voor een hero bovenaan je pagina werkt 70 tot 85 vh vaak goed: de bezoeker ziet dan nog net dat er meer komt.

Tekst onderin of in het midden

In een hoge sectie bepaal je met Uitlijning instellingen → Uitlijning van kolommen waar je tekst staat: Boven, Midden of Onder. Zie kolommen uitlijnen. Met een foto erachter lees je meer in een foto als achtergrond.

Padding: de ruimte boven en onder

Elke sectie heeft standaard dezelfde ruimte boven en onder, uit je huisstijl. Zo ziet je hele site er rustig en gelijk uit. Wil je bij één sectie meer of minder ruimte:

1. Vink in Afmeting instellingen het vakje Padding instellen aan.
2. Stel Padding aan bovenkant en Padding aan onderkant in, van 0 tot 400 pixels.

Verschuif je een van de twee niet, dan houdt die kant de standaardruimte. Wil je echt 0, schuif hem dan naar 0.

Andere padding op mobiel

Op een telefoon voelt veel witruimte al snel leeg. Vink Aangepaste padding instellen voor mobiele apparaten aan en stel Padding aan bovenkant op mobiele apparaten en Padding aan onderkant op mobiele apparaten in.

Container volledige breedte

De inhoud van een sectie staat normaal in een container: een vak met een maximale breedte in het midden van het scherm (standaard 1300 pixels). Op een breed scherm blijft er links en rechts ruimte over. De achtergrond van de sectie loopt wel altijd door tot de rand.

Wil je dat ook de kolommen tot de rand van het scherm lopen, bijvoorbeeld voor een rij foto’s? Open het paneel Container instellingen en vink Container volledige breedte aan. Een andere breedte, zoals een smallere container voor een lange tekst, is er niet. Daarvoor gebruik je een smallere kolom, bijvoorbeeld 8 breed met lege kolommen van 2 ernaast.

Wanneer pas je niets aan?

Meestal. De standaardruimte zorgt dat alle secties op je site even ver van elkaar staan. Pas de padding alleen aan als er een reden voor is, bijvoorbeeld:

• een sectie die direct op de vorige moet aansluiten (padding aan bovenkant op 0);
• twee secties met dezelfde kleur onder elkaar, waardoor de ruimte dubbel wordt (zie een achtergrondkleur kiezen);
• een korte sectie met alleen een knop.

Wil je meer ruimte tussen twee blokken binnen een kolom? Dat is geen padding van de sectie: gebruik het blok Horizontale tussenruimte. Zie ruimte tussen blokken.

Lukt het niet?

• De padding verandert niet: staat Padding instellen aan, en heb je de schuifregelaar echt verschoven? Een waarde die je niet aanraakt, wordt niet opgeslagen.
• Op je telefoon zie je de gewone padding: heb je ook Aangepaste padding instellen voor mobiele apparaten aangevinkt? Ververs de pagina op je telefoon.
• De sectie is hoger dan je instelde: de inhoud past er niet in. Minder tekst, of een kleinere minimale hoogte.
• Bovenaan je pagina is extra ruimte: bij een vaste header krijgt de eerste sectie extra ruimte, zodat je tekst niet achter het menu verdwijnt. Dat is de bedoeling.
• Kolommen staan op mobiel anders dan je wilt: zie kolommen op mobiel.

Veelgestelde vragen