How to adjust Cornerstone elements for mobile and other smaller screens

[444media]

I am having an issue with a simple Text element not displaying properly on mobile. See screenshot. I can see in Cornerstone how you can view what the page will look like on other screen sizes, but is there a way of independently adjusting the margins and padding and whatnot for smaller screens without affecting the larger screens formatting and layout? Slider Revolution allows for that…I can adjust the layers for mobile and not have it affect how they look on a desktop. Is that possible with Cornerstone?

The website is launchtechholdings.com

Thanks,

Chris

[jade]

Hello Chris,

It looks like you have added 11em left and right margin to the text element in question.

The quickest way to solve it would be to duplicate that text element and have one display on desktop (the one with left and right margins) and the other display only on mobile.

You can do so by making use of the Hide During Breakpoint option of the text element.

Please check here:

Text | Themeco Docs

Hope this helps.

[444media]

Ag great…thanks Jade! I recall this being the process now. I had forgotten. I will play with the sections that are not appearing correctly on mobile. I’ll follow up if I have any further issues, but thanks!

[jade]

Sure thing. You’re welcome, Chris.

[444media]

Hi Jade,

So I am not seeing Hide During Breakpoint section is. Likely because Advanced Mode is not on. However, under Settings >> Preferences for some reason the Advanced Mode toggle is not available. I feel like I usually turn that on when I first start building out a site with X, and feel like I turned it on on this site, but maybe not? But I am not seeing it where usually it is and where the documentation (https://theme.co/docs/advanced-mode ) says it is. Isn’t it usually the first option on the top of the preferences page?

[444media]

I found in another area where I can adjust Advanced Mode, and I have it set to Always On. Under X >> Settings. But still not seeing where in the settings for the section Hide During Breakpoint.

[444media]

Not seeing the Hide During Breakpoint box as pictured in documentation for the section setting

[christopher]

Hi @444media,

The section that you changed is the permissions section. The correct place is the one that is mentioned in the document.

Would you please kindly get back to us with the URL/User/Pass of your website dashboard so we can check ourselves and see what is the problem cause?

You can use a Secure Note to give the information.

Thank you.

[444media]

OK…yeah where I showed you in the last screen shot is not where I thought it was. But where in the documentation where you area saying it is, is where I usually turn Advanced Mode on. But for whatever reason I am not seeing it.

I will attach a secure note with details for you to look in the back end and see.

Thanks Christopher

Chris

[ruenel]

Hello Chris,

Thanks for updating in!

The Advanced Mode is already enabled in your site. The “Hide During Breakpoint” options can be found in the Customize tab in the element settings.

• 

We would love to know if this has worked for you. Thank you.

[444media]

OOOHHHH! Found it Thanks! Don’t know how I missed that!

And see where I can add specific CSS for the element, perfect!

Thank you so much

[friech]

You’re more than welcome, glad we could help.

Cheers!