How to fix mobile version?

[kyber]

I created a new page and I’m trying to optimize it for mobile as it’s “poorly” rendered for now.

1. How do I reduce the margins in the mobile version? Right now the gap is pretty big.
2. how do I reduce the font size? Can I reduce it proportionally for all the elements? Or should I do for each headers, body, etc.
3. The menu on mobile seems broken - how to fix it?

Thanks.

[lely]

Hi @kyber,

@kyber

How do I reduce the margins in the mobile version? Right now the gap is pretty big.

I don’t see large gap on mobile view. It seems fixed now, can you confirm?

@kyber

how do I reduce the font size? Can I reduce it proportionally for all the elements? Or should I do for each headers, body, etc.

You have three options for responsive font size:

1- You can use the Responsive text tricks and set the font size in a way that it will be responsive. You can learn about that here .
2- You can hide the element that you used in Cornerstone/Content builder for mobile and add another element and set the font smaller. Please kindly click here for more information on how to hide elements in various viewports.
3- You need to use custom CSS code to force the smaller font size. (This is customization and outside of our support scope.)

@kyber

The menu on mobile seems broken - how to fix it?

I can see the issue. On your console I found this error:

Ignored attempt to cancel a touchend event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.

Can you try basic troubleshooting first? See this article for detailed guidance. No need to go trough everything, please try only: Testing for Plugin Conflict