Shopify themes, liquid, logos, and UX
Hi, I have a problem with the hover effect on a button and on a product.
When I hover over the button or product, it tilts about 10 degrees to the right.
What could be causing this? I don’t even remember making any changes.
You can check out the button here: https://1049xn-ya.myshopify.com/
And the product here: https://1049xn-ya.myshopify.com/collections/all
Thank you so much for any help.
Tim
Honestly, I don’t know. I haven’t installed any new plugins; I’ve just added some code. Could it be caused by one of the codes?
Or is there a way to fix it with code?
Here’s the code I used for the hover effect on the button:
.button {border: 1px solid black;}.button:hover {color: white; background-color: black; transition: 0.5s;}
(I added this to the custom CSS for the section.)
And here’s the code I used for the hover effect on the product:
<style>
.product-card-wrapper .media.media--hover-effect > img + img {
transform: translateX(100%) !important;
}
.card-wrapper:hover .media.media--hover-effect>img+img {
transform: translateX(0%)!important;
}
</style>
(I added this to theme.liquid)
Thanks for the feedback!
Tim
- Here is the solution for you @CreatorTim
- Please follow these steps:
1. Go to Online Store --> Theme --> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head> and press 'Save' to save it
<style>
.button:hover {
transform: none !important;
}
</style>
- This is the result you will get:
- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
Hey, it works for the button, but I’d like to do the same for the product’s appearance.
How can I fix it so that the product is aligned as well?
You can check it out here: https://1049xn-ya.myshopify.com/collections/all
Thanks a lot,
Tim
Can you describe more clearly what you want?
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025