Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

swap image and text order for mobile viewing


awk

Question

  • Answers 7
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

7 answers to this question

Recommended Posts

  • 0

Add this to your custom CSS:

@media screen and (max-width:640px) {
  div#block-6d69e12e014e3d9add6b+.row, div#block-1220f1cf71ba0a72fc4d+.row {
    display: flex!important;
    flex-direction: column-reverse!important;
  }
}

Credit: I modified code provided by @tuanphan in this forum post.

Edited by dvgdvgdvg
Link to post
  • 0
1 hour ago, awk said:

Hi, for some reason it isn't working 😕

Sorry about that, it was working perfectly in Inspector so not sure why; but I updated the code in the previous comment to try a different approach and it should work now — try again!

Link to post
  • 0
3 minutes ago, awk said:

So I'd need to change the code to work with this page then? 

https://www.taylergroup.com/team

Yep – the code works by targeting the row after each spacer block we include the ID for, so you just swap out the bits between each hashtag and plus sign with the IDs for the blocks on this page. So that code would be:

@media screen and (max-width:640px) {
  div#block-yui_3_17_2_1_1612348299837_249909+.row, div#block-yui_3_17_2_1_1611844728135_430177+.row, div#block-yui_3_17_2_1_1611844728135_62014+.row, div#block-yui_3_17_2_1_1611844728135_350620+.row {
    display: flex!important;
    flex-direction: column-reverse!important;
  }
}

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...