Make Logo Centered

Solved

Make Logo Centered

martujv
Pathfinder
154 2 35

Hello!

 

I am working on a test website and I made some custom modifications to my header. I guess one of the custom codes that I added makes the logo to be aligned a little bit to the left instead of being 100% centered (both on mobile and desktop). I can't really delete the custom codes that I already have since I need them.

 

Is there any code to force the logo to be centered correctly? (Both on mobile and desktop)

 

My theme is Stiletto and this is the theme's preview link: https://nael1y2i8hg57vdm-60150284501.shopifypreview.com

 

(And yes, I have the "logo in the center" option activated and it's still not working)

 

I would really appreciate some help as I tried a million codes already but nothing works!

Accepted Solution (1)

BSSCommerce-HDL
Shopify Partner
2305 833 906

This is an accepted solution.

Hi @martujv 


You can follow these steps

Step 1:  Please navigate to Online store => Themes => Edit Code

Step 2: Find a file with file extension is .css

Step 3: Add this code and save:

 

.header__row.header__row-mobile.three-segment .header__logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

We're happy to support you. Can you give us a like or accept solution? This can greatly motivate us to contribute to our community.

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

View solution in original post

Replies 2 (2)

BSSCommerce-HDL
Shopify Partner
2305 833 906

This is an accepted solution.

Hi @martujv 


You can follow these steps

Step 1:  Please navigate to Online store => Themes => Edit Code

Step 2: Find a file with file extension is .css

Step 3: Add this code and save:

 

.header__row.header__row-mobile.three-segment .header__logo {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

We're happy to support you. Can you give us a like or accept solution? This can greatly motivate us to contribute to our community.

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

martujv
Pathfinder
154 2 35

It worked! thank you!