[Resolved] make image come first in mobile

[generatepressuser]

Hello,

On Frontpage, how could I make the image come in first place “before” text in mobile?
At the moment, the image is after the text.

Regards

[Leo]

Hi there,

This would be a question for WordPress support as the columns block is from the Gutenberg editor itself.

Can you add a class like second-column to the second column? Then I can try with some CSS.

Let me know 🙂

[generatepressuser]

Ah I see, okay yes I have put the class “second-column” inside wordpress with edit page inside second column, which is the image.

[Leo]

Actually try this:

@media (max-width: 768px) {
    .wp-block-columns.has-2-columns .wp-block-column:nth-child(2) {
        order: 1;
    }
    .wp-block-columns.has-2-columns .wp-block-column:first-child {
        order: 2;
    }
}

This will apply to all columns block.

[generatepressuser]

Ah perfect it worked!

Thanks 🙂

[Leo]

No problem 🙂

[Author]

Posts