[Support request] reverse column order on mobile using Guternberg

[Christine]

Dear Support,

On my website I want to reverse column order on mobile I am using Guternberg editor for my website.
Following is the sequence I am looking for https://prnt.sc/onai99

Looking forward!

[David]

Hi there,

so ad this CSS:

@media (max-width: 768px) {
    .reverse-mobile {
        flex-direction: column-reverse;
    }
}

Then select the Columns block ( make sure its the columns and not a single column ) and on the Settings Sidebar > Advanced > Additional CSS filed add reverse-mobile

[Christine]

Hi David. Your Code Worked for me.

Thank you.

[David]

Glad to be of help

[Heinrich]

Hi David,

I tried to modify the code so the columns swap at 1030px, but that doesn’t work.

@media (max-width: 1030) {
.reverse-mobile {
flex-direction: column-reverse;
}
}

[David]

Hi there,

can you raise a new topic where you can share a link to your site and ill take a look 🙂

[Author]

Posts