Headline text not centered on mobile

Hi,
Please my headline text is not well positioned on mobile even after adjusting margin and padding.
What can I do please?
the site is ‘goodlifeafrica.cloudaccess.host’

Hi There @Teeebest

Thanks for writing in! Upon checking, I see that you have added the following custom CSS rules which makes your alignments improper.

.x-text-content-text {margin:-36px;}

Please remove it and use center-text class and assign it into your headline text to center your elements.

If you want to maintain different alignments on desktop and mobile views, use hide during breakpoints feature and add separate elements for desktop and mobile. Please follow our guide here on hide during breakpoints (https://theme.co/apex/forum/t/hide-during-breakpoint-explained/17378).

Hope that helps.

Thanks Darshana,

Please I don’t seem to find .x-text-content-text {margin:-36px;} any where.
I added center-text to the class but the issue remains the same.

Hide-during -breakpoint will remove the header on mobile view which I don’t want. further help will be appreciated. Thanks

Hi @Teeebest,

I don’t see that headline alignment issue on my end.



The issue that I am seeing is that Destinies…Changing gets overflown, that is because you did not put a space between Destinies and Changing so they are consider one word and did not wrapped. Please put space between the two words.

Thanks,

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.