How to swap image and text order for mobile view

Site URL: https://www.designedbyemi.com/brand-website-design-services

Hi! 

I was wondering if someone can help me rearrange the blocks in the 'How It Works' section (namely 02. Design Process)?

As we all know that on mobile, the text will appear before the image, and I would ideally like to know how to rearrange it so the image appears before the text on mobile, like 01. Pre-Design would.

Thank you :)

SITE URL: https://www.designedbyemi.com/brand-website-design-services

PASSWORD: dbe

So this code should work for you, stick it in the Design > Custom CSS section

@media all and (max-width: 640px){
 #p-rocess{
   .sqs-layout > .row:nth-of-type(6){
    display: flex;
     flex-direction: column-reverse;
   }
  }
}

2 hours ago, JoeCory said:

So this code should work for you, stick it in the Design > Custom CSS section

@media all and (max-width: 640px){
 #p-rocess{
   .sqs-layout > .row:nth-of-type(6){
    display: flex;
     flex-direction: column-reverse;
   }
  }
}

 

Worked perfectly, thank you JoeCory!!

Hi there, 

I tried using this custom CSS for our site, but can't seem to get it to work. I need it for this specific page on our site. Any advice?

https://www.taylergroup.com/team-copy-for-mobile-test

On 2/17/2021 at 1:45 AM, awk said:

Hi there, 

I tried using this custom CSS for our site, but can't seem to get it to work. I need it for this specific page on our site. Any advice?

https://www.taylergroup.com/team-copy-for-mobile-test

You want

text - image - text - image

or

image - text - image - text?