Zo wissel je twee kolommen op mobiel en tablet

Stap 1: Ga in je Dashboard naar Divi -> Thema Opties

Plak onderaan bij Aangepaste CSS de volgende CSS code:

/*KOLOMMEN OMWISSELEN OP MOBIEL EN TABLET*/
@media all and (max-width: 980px) {
    .wissel-kolommen {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }
}

TOELICHTING: Deze CSS draait de volgorde van de kolommen om (vandaar de term: reverse). Deze CSS werkt ook bij een Rij met méér dan 2 kolommen, de vraag is alleen of je dit ooit wilt 😋.

Stap 2: Ga naar je Rij instellingen -> Geavanceerd

Onder CSS-ID en -klasses zet je dan bij CSS-ID wissel-kolommen.

Stap 3: Check de mobiele weergave en klaar!

Doordat je de kolommen omwisselt, moet je vaak nog wat dingen aanpassen in de marges en buffers voor de mobiele weergave. Is alles naar je zin? Dan ben je klaar!

TIP!

Als je deze truc vaker wilt toepassen op je website, hoef je dus alleen nog maar in de Rij-instellingen de CSS Klasse wissel-kolommen mee te geven 😎.

Succes en groetjes! 🤩 Let me know als je er wat mee kon!