Single column template not working for smallest viewport (480px and below) after updated to Pro 5

[mimisim]

Hi,

Attached screenshot whereby the single column template is not working in smallest viewport. It worked previously in Pro 4.

Kindly assist.

[friech]

Hi Simon,

Thank you for writing in, in the latest version we release a new feature called Responsive Styles, you can see that new feature by clicking the control label.

Please watch the following tutorial for more details about this new feature.

How to Set Responsive Styles for Elements in Cornerstone

Cheers,

[mimisim]

No, it’s still not working.
The 480px and below is not responding to single column layout, it show two column layout instead.

See attached screenshot.

[tristup]

Hi Simon,

It will be very difficult to recognize the reason behind your issue without investigating it through the WordPress admin dashboard. I would suggest you, please provide login credentials for your site in a secure note, including:

– WordPress Site URL & Login URL
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

[mimisim]

Ok. I have provided login credentials in the secure note.

The problem highlighted is in Contact Section of Home page.
Contact > Row 1 > Column 2 > Row 1

Also in Contact > Row 1, for larger viewport the 2 column layout also not working unless I manually input (50% 35%) instead of default (50% 50%)

Kindly assist.

[friech]

Hi Simon,

Thank you for the clarification, I investigated the issue, and yes the first issue seems to be a bug, but there is a workaround on it, instead of using the column template as an actual width of the column, you can actually use it as a flex-basis.

The second issue is because you’re using a calc() function on the Gap Width and Gap Height, please note that those 2 properties will be output inside a calc() function in the frontend, so it will became nested (calc(calc())) which is invalid.

Hope it helps,
Cheers!

[mimisim]

Thanks for clarification. So in Pro 5, the calc() function is no longer supported? Because my font size and some others is still using calc() function, if that’s the case, I’m going to change those calc() to responsive styling.

[friech]

Hi Simon,

No, you can still use the calc() function on font-size and other controls. I’m particularly talking about the Gap Width and Gap Height of the ROW that you cant use calc() in there.

Thanks,