Social Icon image alignment

[mmelton12]

Hi,

I am experiencing the same issue as the user in this thread:

Social media sharing button icon center issue

The only problem (before adding in css per above solution) is that the icon aligns vertically centered on the home page, but on all other pages, it has the problem. By adding the css in, it fixes the issue on all pages, but on the home page it pushes the icon down to bottom alignment.

Please advise!

Thanks,
Matt

[ruenel]

Hello Matt,

To better assist you with your issue, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Best Regards.

[friech]

Hi Matt,

Thank you for the credentials, but sorry I can’t see any social icons on your footer or header of your site.e

I see that your X and Cornerstone version is not compatible, please update your X theme to the latest version (7.1.2) first. That incompatibility issue might be the culprit of your icon issue.

Updating Your Themes and Plugins

Remember to clear all your caching features (plugin, server-side, CDN, and browser’s cache) after updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

If the issue persists, you can update the given CSS code provided on the other thread to this:

body:not(.home) .x-social-global a i {
    padding-top: 16px;
}

That way it will not affect the home page.

Thanks,

[mmelton12]

Updated the theme, added in code you suggested (cornerstone global CSS), still having issues.

Take a look at following pages (social icons aligned to top):
doorpath.vn/faq/
doorpath.vn/contact/

@friech

body:not(.home) .x-social-global a i {
padding-top: 16px;
}

[ruenel]

Hello @mmelton12,

I have made some changes to the code and use this instead:

body .x-social-global a i {
	padding-top: 16px !important;
}

Since you are using SiteGround, please clear your site cache or at least disable the supercacher in your hosting panel. The SuperCacher is developed by SiteGround exclusively for their customers. It increases the number of hits a site can handle and boosts the website loading speed. The SuperCacher includes 4 different caching options for maximum optimization of your websites. You can access the tool by clicking on the SuperCacher icon in your cPanel.

For more information about this, please check it out here: https://www.siteground.com/tutorials/supercacher/supercacher_intro.htm

Hope this helps.