How to center social media icons on Canopy

[jenniferwfd]

Hi,

I would like to center the social media icons on the Canopy theme. Please can someone help with this? It currently looks like the image attached below:

The code shows as:

.social-links {
margin: 0;
display: flex;
flex: 50%;
text-align: center;
}
.social-links .social-links__list {
padding: 0;
margin-top: 1em;
}
.social-links li {
display: inline-block;
margin: 0 0.3em 0.5em;
}
.social-links li:last-child {
margin-right: 0;
}
.social-links a {
display: inline-block;
}
.social-links a:hover {
opacity: 0.8;
}
.social-links svg {
width: 17.1px;
height: 17.1px;
overflow: visible;
}
.social-links svg, .social-links svg g {
fill: currentColor;
}
.social-links img {
width: auto;
height: 19px;
vertical-align: middle;
max-width: none;
}

Thank you in advance for any help!

Kind Regards,

Jennifer

[diego_ezfy]

undefined, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > styles.css and paste this at the bottom of the file:

.footer-lower{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.footer-lower > *{
    text-align: center;
    padding: 0 !important;
}

.footer-lower > *:nth-child(1){
    margin-bottom: 10px;
}

Kind regards,
Diego