Switch Text Image Order in Mobile

[eugenio_rossi]

Hi there,

I've searched a little bit about it but I've not found anything useful.

Basically, we would need to switch some modules order from Desktop to Mobile visualization.

We have a situation like:
[Text] + [Image]
[Image] + [Text]

And in mobile, it displays as two consecutive images. Within bootstrap framework there is a class (col-[x]-pull or push) to handle the situation in different layout.

Is there any solution to that within HS?

Let me know if I've been clear enough 🙂

[YHoffman]

Hello, this should be a simple and normal function for any website builder.  Is there a new solution?

[jonchim · Accepted solution]

Hey @eugenio_rossi, I don't believe there's a default class within HS that would switch the modules,

I like to define a class maybe something like col-switch and then use display: flex on mobile query

@media (max-width:767px)
  .col-switch {
   display: flex; 
   flex-direction: column-reverse;
  }
}

[Kevin-C]

Hey @eugenio_rossi 

At this time I do not think there is an elegant way to handle this outside of a custom module. But I could be wrong!

This funtionality has been submitted a few times on the ideas board. And if memory serves me correctly Hubspot Devs have noted that they are working on it.  I'd suggest you find it there and give it an up vote!