Why Isn't My Section a responsive layout for Mobile?

[adkseorev]

Guys -
I’m having a heck of a time translating my desktop version of my homepage to each lower screen size, but I’m going to present one specific issue for now:

On my homepage, for one section I have designed a pretty standard 1 row 4 colum setup:

I have a section > 1 Row > 4 Columns

Each Column: 1. Personify: Hero Heading and 2. Text

Now, looks normal on desktop, but it isn’t having responsive behavior for lower screen sizes and I’m trying to figure out why. Here is what it looks like on mobile - showing just 1 of the 4 columns properly, for example:

Why isn’t it properly bringing the other 3 columns into view so that it is a stack of 4 x 1? I’ve tried everything I can think of without redesigning the entire thing.

[prakash_s]

Hello @adkseorev,

Thanks for writing to us.

In order to help you with your concerns, we need to check your settings. I would request please share the admin login details meanwhile I would suggest you troubleshoot a few of the common issues before we investigate your settings. Please share your details in a secure note. Please provide the following details

• WordPress Login URL
• Admin-level username and password
• Exact page URL

You can find the Secure Note button at the bottom of your posts

Thanks

[ruenel]

Hello Bobby,

First, your Row element is not centered because you have added a 300 pixel right margin.

If you want this to the center of the page, the right and left margins would need to be set to “auto”.

2nd: You have a 4-column row. At the moment, it is not responsive because you have not set the number of columns for different screen sizes.

Click the word “Template” to launch the responsive layout selector, where you can set the number of columns for specific screen sizes.

For more details about Responsive Styling, kindly check out this documentation:

Responsive Styling | Themeco Docs

And you might be interested in video tutorials here:

Best Regards.