Bg blocks

Responsive kolommen

Het uitlijnen van inhoud in kolommen en Media & Tekst block

Maak het mogelijk om een minimale kolombreedte in te stellen. De kolommen zullen uitgevuld worden met een minimale in te stellen breedte. Wanneer deze breedte is bereikt zullen een of meerder kolommen onder elkaar komen te vallen

Hoe werkt het?

Stap 1

Plaats kolommen block in je pagina. Selecteer Kolommen (niet een losse Kolom). In de rechterbalk verschijnt bij een vinkje ‘Minimale kolombreedte’. Activeer deze.

Scherm­afbeelding 2023 05 30 om 10.14.14
Scherm­afbeelding 2023 05 30 om 10.15.18

Stap 2

Voer hier de gewenste minimale breedte voor de kolommen in.

Wanneer je 300px invult en de breedte van het kolom is 900px (afhankelijk van de breedte van de browser) zullen er 3 kolommen naast elkaar worden getoond. Wanneer de breedte hoger of lager is als 900px zullen er dus meer of minder kolommen naast elkaar worden getoond.

Stap 3

Controleer of de gewenste instellingen naar wens zijn wanneer je op je telefoon, tablet of desktop kijkt. Op desktop is het mogelijk om je schermgrootte te verslepen.

Scherm­afbeelding 2023 05 30 om 10.24.45

Voorbeelden

Minimale kolombreedte 300 px (pixels)

Kolom

Kolom

Kolom

Kolom

Minimale kolombreedte 250 px (pixels)

Kolom

Kolom

Kolom

Kolom

Minimale kolombreedte 150 px (pixels)

Kolom

Kolom

Kolom

Kolom

Kolom