Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi,
I have edited some code to put each collection title on top of the corresponding image, however, my issue is that the text keeps wrapping as there seems to be padding on each side of the image and the text won't go the full way across it on one line.
This is what I mean:
This is the code I have already written to achieve this:
<style> ul#Slider-template--20911263318360__477125e9-4070-47c9-ab6d-93a16c1c6ed6 .full-unstyled-link{ position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); font-size: 26px; /* change this to adjust the text size */ color: white; justify-content: center !important; } /* Homepage collection text desktop */ </style>
Site link is: https://mauriciobenyar.myshopify.com/
Would really appreciate if someone could help,
Thanks
Solved! Go to the solution
This is an accepted solution.
Hi @tobyh4
Add this to your code.
width: 100%;
text-align: center;
And Save.
Result:
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
This is an accepted solution.
Hi @tobyh4
Add this to your code.
width: 100%;
text-align: center;
And Save.
Result:
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
Thank you, works perfectly.
Do you also know if I could add code to make the image opacity 60%?
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025