Shopify themes, liquid, logos, and UX
When i use the product list in craousel the scroll arrows dosent appear on desktop. Somehow i tried increasing the gaps i saw the arrowes are under the products thats why they are not showing what can i do?
https://thenewbeast.myshopify.com/
000
Your carousel arrows are hidden because they're placed under the product items due to CSS layering issues.
Add custom CSS like z-index: 10 and position: absolute to the arrow container to bring them above.
Also ensure your theme's carousel settings have arrows enabled and properly positioned.
Hello @NOT1
It sounds like the scroll arrows are being hidden behind the product cards due to a z-index or positioning issue. Here’s how you can fix it:
Inspect the arrows using your browser’s developer tools to find their class (usually something like .slider-button or .carousel__arrow).
Then, try adding this custom CSS to bring them above the product cards:
.carousel__arrow { z-index: 10 !important; position: relative; }
If they're still not showing properly, you might also need to adjust margins or padding around the carousel:
.product-carousel { padding: 0 40px; /* Add horizontal padding so arrows have space */ position: relative; }
And if the arrows are inside another container with overflow: hidden, try this:
.carousel-container { overflow: visible !important; }
Let me know if you have any issues!
None of them worked
Can you share any screenshot with us, so we can check.
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