Jump to content

Change block order on mobile

Recommended Posts

  • Replies 3
  • Views 543
  • Created
  • Last Reply
Posted
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?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Posted
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;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.