Solved

Why isn't all footer text centre aligning in Shopify?

onyx_au
Explorer
63 1 20

Hey guys,

Only half my footer text is aligning centre with code:

text-align: center !important;

 

Attached before and after, how do I get everything centered?

 

Website: https://james-c-c-c-c.myshopify.com

Password: maicro

Accepted Solution (1)
dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@onyx_au 

In theme -> Online Store -> Action -> Edit code ->

Go to the Assets -> open theme.css

Then paste this code at the bottom of file.

@media only screen and (min-width: 750px){
.site-footer__item--one-quarter {
    justify-content: center;
    text-align: center;
}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 9 (9)

dmwwebartisan
Shopify Partner
12280 2546 3694

@onyx_au 

In theme -> Online Store -> Action -> Edit code ->

Go to the Assets -> open theme.css

Then paste this code at the bottom of file.

.site-footer__item.site-footer__item--one-third {
    justify-content: center;
    text-align: center;
}

li.site-footer__linklist-item {
    padding: 0 0px 5px 0;
}
hr.site-footer__hr {
    display: none;
}
hr.site-footer__hr + .page-width .grid__item.one-half.small--one-whole{
    width: 100%;
    text-align: center;
}
.site-footer__payment-icons{
    text-align: center;
    margin-top: 15px;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
onyx_au
Explorer
63 1 20

Hi @dmwwebartisan !

Thanks for this, but it didnt work? It moved the payment icons slightly, thats it

 

screenshot attached

dmwwebartisan
Shopify Partner
12280 2546 3694

@onyx_au 

Please add the provided CSS code I will check and send the correct solution to you.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
onyx_au
Explorer
63 1 20

@dmwwebartisan 

Thanks! I added back the code

eFoli-Marvic
Shopify Partner
223 40 39

@onyx_au 

add this code to your style.css file.

Navigate to online store >> Click edit theme code.

Now find style.css and paste the following code: 

.site-footer__payment-icons{
     width: 100%;
}
Marvic | EFOLI
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Checkout our apps:Inkybay || MultiVariants
onyx_au
Explorer
63 1 20

@eFoli-Marvic 

Thanks but I want everything in my footer to be centre aligned. The pay icons can stay justified left

onyx_au
Explorer
63 1 20

Bump..

 

Can anyone help me please?

dmwwebartisan
Shopify Partner
12280 2546 3694

This is an accepted solution.

@onyx_au 

In theme -> Online Store -> Action -> Edit code ->

Go to the Assets -> open theme.css

Then paste this code at the bottom of file.

@media only screen and (min-width: 750px){
.site-footer__item--one-quarter {
    justify-content: center;
    text-align: center;
}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
onyx_au
Explorer
63 1 20

@dmwwebartisan 

Awesome! Thanks! That worked 🙂