Change block order on mobile

Site URL: https://www.longitudepr.com/results

Hello,

I know this question has been asked and answered before but I have tried and tried to find a solution for stacking the images on mobile correctly. Would anyone mind delivering the css? 

Results page needs to stack Image 1 Image 2 Image 4 Image 3 Image 5 image 6 image 8 image 7.

Thank you so much!

On 4/20/2021 at 1:14 AM, studiocarnley said:

Site URL: https://www.longitudepr.com/results

Hello,

I know this question has been asked and answered before but I have tried and tried to find a solution for stacking the images on mobile correctly. Would anyone mind delivering the css? 

Results page needs to stack Image 1 Image 2 Image 4 Image 3 Image 5 image 6 image 8 image 7.

Thank you so much!

You want on mobile, it will be

image - text - image - text.. Is this right?

3 hours ago, tuanphan said:

You want on mobile, it will be

image - text - image - text.. Is this right?

That is correct! 

18 hours ago, studiocarnley said:

 

That is correct! 

Add to Design > Custom CSS

/* Mobile image text image text */
@media screen and (max-width:767px) {
div#page-605cdc88ce619e621c479a20 .span-12>.row:nth-child(2), div#page-605cdc88ce619e621c479a20 .span-12>.row:nth-child(4) {
    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;
}
}