Center the buttons on the HomePage Banner

Solved
MartaSantacana
Excursionist
18 1 9

Hello,

How can I center the buttons (SHOP AND CLASSES) in the Banner in the Home Page? They changed to be left aligned I don't know why and I can't find how to center them.

This is the shop: https://suzanne-raffellini.myshopify.com/

password: suzanne

 

THANK YOU!!!

Accepted Solutions (3)

Accepted Solutions
dmwwebartisan
Shopify Partner
9824 2234 3071

This is an accepted solution.

@MartaSantacana 

Please add the following code at the bottom of your assets/section-image-banner.css file. 

.banner__box>*+.banner__buttons--multiple {
    margin: 0 auto;
}

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 | Bag is a cart drawer that maximizes your sales. View app →

View solution in original post

Zworthkey
Shopify Partner
2567 309 641

This is an accepted solution.

 

 

.banner__buttons.banner__buttons--multiple {
    margin-top: 10px !important;
}

 

@MartaSantacana Add this code. in section-image-banner.css 

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com

View solution in original post

dmwwebartisan
Shopify Partner
9824 2234 3071

This is an accepted solution.

@MartaSantacana 

Remove prevoius cs code and add this code 

Please add the following code at the bottom of your assets/section-image-banner.css file.

.banner__box>*+.banner__buttons--multiple {
    margin: 0px auto;
    padding-top: 15px;
}
If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →

View solution in original post

Replies 12 (12)
Zworthkey
Shopify Partner
2567 309 641

@MartaSantacana 

 

.banner__buttons.banner__buttons--multiple {
    margin: auto !important;
}

 

Add this code in theme.scss or theme.css or assets/section-image-banner.css file
thank you.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
dmwwebartisan
Shopify Partner
9824 2234 3071

This is an accepted solution.

@MartaSantacana 

Please add the following code at the bottom of your assets/section-image-banner.css file. 

.banner__box>*+.banner__buttons--multiple {
    margin: 0 auto;
}

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 | Bag is a cart drawer that maximizes your sales. View app →

View solution in original post

MartaSantacana
Excursionist
18 1 9

@Zworthkey I just find theme.liquid, I try adding the code there but it doesn't make any changes

Zworthkey
Shopify Partner
2567 309 641

@MartaSantacana assets/section-image-banner.css 
Add in this file.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
MartaSantacana
Excursionist
18 1 9
Zworthkey
Shopify Partner
2567 309 641

@MartaSantacana 
kindly Accept solution if helpful.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
dmwwebartisan
Shopify Partner
9824 2234 3071

@MartaSantacana 

Thanks! welcome again.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
MartaSantacana
Excursionist
18 1 9

@dmwwebartisan  It worked for centering the buttons but now the text is too close to the buttons, how can I add some space? Thank you!

Zworthkey
Shopify Partner
2567 309 641

This is an accepted solution.

 

 

.banner__buttons.banner__buttons--multiple {
    margin-top: 10px !important;
}

 

@MartaSantacana Add this code. in section-image-banner.css 

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme ,
Hire us | Whatsapp. and we also help you to guide how to reach to your potential customers to increase brand presence, engagements and sales for your business or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com

View solution in original post