Hi everyone,
I’m experiencing an issue with my Shopify store where the header icons (Login, Wishlist, and Add to Cart) are overlapping each other. This is happening on desktop view and affects usability.
I’ve already contacted Shopify Live Support, but they weren’t able to resolve it. They mentioned that this would require a Shopify expert or developer to fix, possibly related to theme CSS, header layout, or an app conflict.
Has anyone else experienced this issue?
If you have, I’d really appreciate any guidance on what caused it and how you fixed it.
Thank you in advance for any help.
I’ve seen this happen before It’s often related to theme header settings or an app affecting the header layout you could try temporarily disabling recently added apps or checking the header options in the theme customizer to see if anything changes.
You have Wishlist app installed which adds some CSS code titled “custom css”:
Probably, an attempt to put wishlist link in header?
Anyways – the code marked with red line breaks your header.
The code seem to be injected by the app, so yo need to see in app settings for “Custom CSS”.
Alternatively, you may add this code to either “theme settings”-> Custom CSS or Custom CSS setting of the header section:
.site-header-right {
padding-right: 60px;
}
