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

Changing Code Block Order on Mobile


Question

Hi,

I'm looking to change the order of my code blocks to go by row right-to-left instead of column but can't seem to get the coding right.

I've tried the following, but I don't think I'm targeting the right block. I've also tried the individual #block-yui but it didn't work either. Anyone have any suggestions?

@media only screen and (max-width: 640px) { div#pricing+.row, div#pricing2+.row {
  display: flex;
  flex-direction: row !important;
  }}

Site: https://orchid-flute-gfwg.squarespace.com/book-now

Thanks,

Link to comment
  • Answers 5
  • Created
  • Last Reply

Top Posters For This Question

5 answers to this question

Recommended Posts

  • 0
On 7/2/2021 at 11:29 AM, vanessakrystin said:

Hi,

I'm looking to change the order of my code blocks to go by row right-to-left instead of column but can't seem to get the coding right.

I've tried the following, but I don't think I'm targeting the right block. I've also tried the individual #block-yui but it didn't work either. Anyone have any suggestions?

@media only screen and (max-width: 640px) { div#pricing+.row, div#pricing2+.row {
  display: flex;
  flex-direction: row !important;
  }}

Site: https://orchid-flute-gfwg.squarespace.com/book-now

Thanks,

You want, on mobile, it will be

3 class

montly

10 class

60 min

single class

45 min

Is this right?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 0
On 7/4/2021 at 9:27 AM, vanessakrystin said:

@tuanphan yes exactly! with the 7 Day Trail being last.

You need to recreate layout a bit.

Add block 1, 2, 3

Add a Line Block

Add block 4, 5, 6

Remove Line Block

Then check it again on mobile

See screenshot: https://prnt.sc/18p3udm

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment

Create an account or sign in to comment

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


×
×
  • Create New...