Change color and center text

Solved

Change color and center text

Muselabel
Excursionist
44 0 7

Hello,

Does anyone know how I can center the text in the circled box and change the colors of the product columns to a different color? I would like the color to be dark pink with white text for the product columns.

 

Thank you in advance!

 

Foto 11-01-2025 om 11.20.jpeg

Accepted Solution (1)

EstherBui
Trailblazer
276 39 43

This is an accepted solution.

Hi @Muselabel 

 

You can follow this instruction:

1. Go to Shopify > Theme > Customize

2. Copy and paste this code on Theme settings > Custom CSS section

 

.complementary-products__container * {
    text-align: center !important;
}
.complementary-products__container .card__content .quick-add {
    justify-self: center !important;
}
.complementary-products__container ul.list-unstyled li .card-wrapper.product-card-wrapper .card.card--card.card--media {
    background: deeppink !important;
}

 

Result: 

EstherBui_0-1736594871268.png

 

Best, 

 

Esther

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

View solution in original post

Replies 2 (2)

Rahul_dhiman
Shopify Partner
808 155 169

Hello @Muselabel 
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

.summary__title {
text-align: center !important;
}

result
132.png

If this was helpful, hit the like button and accept the solution.
Thanks

Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront

Contact here


BEST CUSTOMER ACCOUNTS APP WITH CUSTOM WISHLIST OPTION 
TRY OUR APP :

PWC: Customer Accounts & Pages

EstherBui
Trailblazer
276 39 43

This is an accepted solution.

Hi @Muselabel 

 

You can follow this instruction:

1. Go to Shopify > Theme > Customize

2. Copy and paste this code on Theme settings > Custom CSS section

 

.complementary-products__container * {
    text-align: center !important;
}
.complementary-products__container .card__content .quick-add {
    justify-self: center !important;
}
.complementary-products__container ul.list-unstyled li .card-wrapper.product-card-wrapper .card.card--card.card--media {
    background: deeppink !important;
}

 

Result: 

EstherBui_0-1736594871268.png

 

Best, 

 

Esther

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!