Cornerstone text misalignment in Mobile view

[VitaliKon]

Hi,

I have multiple issues that I believe stem out from auto responsive function.

1. Text Icons that selected from cornerstone stuck on the top of the text, gap disappeared
2. Some text in other blocks is not shrunk at all and characters disappears
3. Portfolio items’ text is cut on left, no gap.

[tristup]

Hi @VitaliKon,

Can you please provide any screenshot marked with the issue or any video that help us to recognize the problem? I would also request you, please provide login credentials for your site in a secure note to examine it further, including:

– WordPress Site URL & Login URL
– Specific Page URL where you have the issue(s)
– WordPress Admin username/password

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

Thanks

[prakash_s]

Hello @VitaliKon,

I checked your given site URL in iPhone 7 plus it is working fine on my mobile phone. I would suggest you clear your browser cache. Please let us know if I have missed anything.

You can take a screenshot from any screenshot app like Awesome Screenshot and share the link of the screenshot in a secure note.

Thanks

[ruenel]

Hello @VitaliKon,

Please see the secure note because this is what we are seeing.

To know how I inserted the image in the secure note, I added the image in the reply box. I cut the image and paste it into the secure note.

Regards.

[VitaliKon]

pls check what I meant. I have copied the image for your reference.

[prakash_s]

Hello @VitaliKon,

To increase the space between text and icon. I would suggest you add a custom class in the Headline element. For example graphic-space

To add custom class please have a look at the given screenshot below.

Now add this custom CSS code under X–>Theme Option–>CSS

@media(max-width:567px){
.graphic-space.x-text-headline.has-graphic span.x-graphic {
    margin: 0em 1.5em 0em 0em !important;
}
}

Please feel free to change the margin value 1.5em to as per your design. Please feel free to change the class name as well but make sure you change the class name in the given code as well.

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps you.
Thanks

[christian]

Hey @VitaliKon,

To your question:

@VitaliKon

Why the text is glued to the left side, doesnt appear as in desktop view.

You will need to setup a scaling font size. You can learn how to do that here https://www.youtube.com/watch?v=SdQHpAgFumw

@VitaliKon

Why portfolio item doesnt load all footer and slider blocks at all?

This has to do with custom CSS codes on your site. Please codes that cause layout issues like this. Check the codes in Theme Options > CSS or other places you’ve inserted CSS.

@VitaliKon

In general I want to understand how to make footer to be edited once for all my site pages. You know I have to edit footer details on each page to make it same. too laborious. Any options?

That is not possible using X. Please upgrade to Pro so you’ll have a Footer Builder which will enable you to create a Footer per page.

Hope that helps.

[VitaliKon]

I was looking for an answer that allows me to make product showcase be wrapped within existing header and footer structure. I cant guess. I enable the function out of the X available functions list and I see that this function behaves differently from other pages. If is it not developed item than it needs a removal from your advertised product as ready to go. Now you your X seems is out of dated if doesnt offer footer/header management and you are trying to upsell to Pro which cost more than original X. it is not nice.

[christian]

Hey @VitaliKon,

Since you had X since 2015, your upgrade to Pro is free. Please go to your dashboard here https://theme.co/dashboard. Click on Single Licenses > Your license and you’ll see the Go Pro button.

Please also check the X to Pro conversion article here https://theme.co/docs/converting-from-x-to-pro

Hope that helps.

[VitaliKon]

I have read the doc. Since I used cornerstone to build most of the content and also added a few css codes with your help will that transition remove all custom css and damage my site? any precautionary migration strategy?

[marc_a]

Hi @VitaliKon,

If you upgrade your X to Pro theme, the content will just adopt to the upgraded theme because what’s in X theme is also available in Pro theme. Pro theme is also using cornerstone so you have nothing to worry about your content. I see most of the clients upgrade their X to Pro theme with no problem at all. But just to make sure, before doing the transition please create a backup of your current website.

Hope that helps.

Thank you.