Centering Quick Links in Footer - Dawn Theme

[Sato71]

I’m trying to center these quick links in the footer (Dawn theme) so they are centered under the Quick Links title - does anyone know how to do that? I managed to get the other parts of the footer adjusted and centered but not these for some reason. Thanks!

[Made4uo-Ribe]

Hi @Sato71 ,

Can I give a try? WOuld you mind to share your URL website? with password if its protected.Thanks!

[Sato71]

Yes the website is kennasatodesigns.com - thank you!

[INA_MSWEB]

Hi @Sato71

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

@media screen and (min-width: 750px) {

.footer-block {text-align: center;}

.footer-block__details-content>li {margin: 0 !important;}

}

Regards,

San

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset > base.css and paste this at the bottom of the file:

.footer-block__details-content {
    text-align: center;
}

[oscprofessional]

Hello @Sato71

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

.footer-block__details-content {
    text-align: center !important;
}

[Made4uo-Ribe]

Thank you for the infromation. Try this.

1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
3. In the “Assets” folder, click on “base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

.footer-block.grid__item.footer-block--menu.scroll-trigger.animate--slide-in {
    text-align: center;
}

Result:

I hope it help.

[Sato71]

Thanks for the info! When I try these options it centers them but not everything is aligned correctly - instead, is there a way I can align the “Quick Links” and “About Us” to the left?

[MiaIshaaq]

Thank you very much, finally got this to work. Is there a different code so it works on mobile as well please as this only centered desctop version, thank you

[Made4uo-Ribe]

For the mobile check this one.

Same Instruction.

@media only screen and (max-width: 749px){
.footer-block.grid__item h2, .footer-block__brand-info {
    text-align: center !important;
}

.footer-block__brand-info .footer__list-social.list-social, .list-menu__item {
    justify-content: center;
}
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!