Center social icons in header

[treasurevictory]

I’m trying to center the social icons below the logo in the header of my website. I already modified the php file so the social icons are appearing in the middle column below the logo, but the icons are aligned to the left of the column (instead of properly centered). I’ve been trying a number of different CSS modifications but am not having any luck– can you help with this? Thanks in advance.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

.logo-center .social-wrap {
    
    margin-left: 80px !important;
  
}

Thanks
Mohammad

[treasurevictory]

Thanks! This works when viewing the site full-size on a desktop, but if I shrink the browser/ use the mobile version the same issue as before happens. Do you know how to make it responsive?

I tried a number of things… putting in text-align: center and float: center, which did nothing, and tried defining the margin as a percentage or em, which did the same thing as the fixed px margin. I also tried adding in position: relative !important. Not sure what else to try, if you can help that would be great. Thanks again.

[Mohammad – SUPPORT]

Hi,
Please remove last code and use new code:-

ul.social-icons-small{
display:inline-block !important;
}
.logo-center .social-wrap {
    margin: 0 auto !important;
    text-align: center;
    max-width: 300px !important;
    position:relative !important;
    height:25px !important;
}

Thanks
Mohammad

[treasurevictory]

Awesome thank you! Looks great.

[Mohammad – SUPPORT]

Hi,
You most welcome. I’m glad that issue resolved.
Thanks 🙂
With Best Regards
Mohammad