Issue: Make slideshow pagination dots clickable in Shopify’s Dawn 12.0.0 without breaking header layering.
Symptom: Increasing z-index made dots clickable but caused the slideshow to overlay the header (z-order conflict), shown in a screenshot.
Context: z-index controls CSS stacking order; higher values appear on top.
Proposed fix: Increase the z-index of the relevant slideshow dots’ class combination from 2 to 6. A responder reported this works and pointed to the selector via a screenshot.
Request: The OP asked for step-by-step instructions or direct help to apply the change, indicating they still don’t understand how to implement it.
Status: No confirmed implementation by the OP; solution appears plausible but unverified in the thread. Discussion remains open.
Notes: Screenshots are central to identifying the exact selector to modify; the precise selector wasn’t provided in text. Reference/example site links were shared but are not necessary to grasp the issue.
Hello all,
I have a huge issue,
I need to make the dots on the slideshow clickable but then when i increase the z-index this happens
Is there anyway to solve this issue without it affecting the header and makinig the dots clickable
referance site: ishalife.sadhguru.org
My site: www.faithandyou.in
Pw: i love my father [email removed] FOREVER!
Thanks
Hey @AryavK ,
Just increase the z-index of this class combo. It was 2 by default, I changed to 6 and it works.
can you pls do it for me or explain it to me
thanks @ThePrimeWeb
i do not underrstand
