Columns not breaking on mobile

[pukupals]

I’m currently working on a new website using Pro. On the home page, I have a few rows with 2-column layouts.

In the past, I’ve built sites with X, and the columns break on mobile (in other words, each column is shown one after the other instead of side-by-side). Now, for some reason, the rows are maintaining their 2-column layouts on mobile, which is resulting in two very squished content sections.

I’d prefer if the columns broke like before and each column “stacked” on top of each other… can someone show me how to fix this? Here are some screenshots to show what I’m looking for:

Current layout on mobile: https://imgur.com/ZvU4nC0
What I want: https://imgur.com/VxlHTja

Thanks!
Cory

[thai]

Hi There,

Could you please provide us with your website URL so we can take a closer look?

Thanks.

[pukupals]

Sure, I’ll attach it in a secure note on this message.

[christopher]

Hi there,

I checked the page_id=82 page and it is working ok on my browser. It shows the bunny and description section stacked in mobile view. I suggest that you update the theme to version 1.2.6 and flush all caches. I flushed the caches to see the correct view. Also, clear your browser cache and the mobile browser cache which you check the website in.

Thank you.

[pukupals]

Pretty sure I figured out why it wasn’t stacking before. I have the row set to display:flex and that was making the columns maintain their layout. I’ve since implemented some mobile-specific CSS to get everything back to normal on mobile.

[ruenel]

Hello There,

We are just glad that you have figured it out a way to correct the said issue.
Thanks for letting us know!

Best Regards.