How can I center a footer badge in Dawn 12?

[seafoamgreen]

Hello,

I’d like to add this footer badge to my homepage’s footer at the very bottom. I added this code to my footer.liquid file:

But it shows up with the badge all the way to the left, like this bottom image. How can I center it as indicated?

Thanks for your advises!

[Abdosamer]

Hi , @seafoamgreen , can you provide your store url?

[seafoamgreen]

Hi, here it is:
haevabio.myshopify.com

It’s under a password though. I can send you that, but privately through message. Let me know how to do it.

Thanks!

[Abdosamer]

ok, send it privately.

[Abdosamer]

Hi @seafoamgreen , so sorry for late response.
Go to base.css and add the following code:

div#wcb {
    text-align: center;
}

looking forward to working with you on future projects.

[seafoamgreen]

Hi - it worked! But there it needs some space on top of the badge. Is there some code I can add for this? See image..

Thanks so much!

[Abdosamer]

Add this to the same code :

div#wcb {
    margin-top :1rem;
    text-align: center;
}

[seafoamgreen]

OK on desktop, but on my mobile it looks like this (not centered). Any way to fix this?

[Abdosamer]

It is centered on my phone:

[seafoamgreen]

OK maybe it’s just my phone then.

Thanks!