AnnaAntonia

Okay, thank you @tuanphan!

@tuanphanThere's no way to fix the video overlay with CSS code? Is it because I'm using 7.1?

@tuanphanI misread the website sharing options so I can share my website! It's https://mustard-carillon-gjrd.squarespace.com/ and the password is videooverlay. If you scroll down just a little, you'll see the video I'm talking about. Thank you! Also, can you explain how you're able to troubleshoot? Where in the inspect tools are you looking?

Corrected! The website link is https://fish-nectarine-wbzr.squarespace.com/work But the site I'm linking is not my site. I can't share my site.

Site URL: https://fish-nectarine-wbzr.squarespace.com/work This question has not been resolved and many commenters experienced the same issue: The overlay works great but the videos will not play when clicked. I'm using Squarespace 7.1 and using a video embedded with Vimeo. I've linked the site with the desired layout because I can't share my site. (I'm still in trial mode and can't share even with password.) Here is the code: /* Reels video overlay */ .video-caption-wrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; text-align: center; color: white; font-size: 16px; z-index: 50000; pointer-events: none; opacity: 0; transition: all 0.3s; } .video-block .intrinsic:after { content: ""; background-color: rgba(0,0,0,0.5); display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: 20000; position: absolute; opacity: 0; transition: all 0.3s; } .video-block:hover .intrinsic:after { opacity: 1; transition: all 0.3s; } .video-block:hover .video-caption-wrapper { opacity: 1; transition: all 0.3s; } /* Text behind play icon */ .sqs-video-icon { z-index: -9999999999999999; } /* Fullwidth video */ body#collection-605e0f710db7707460c3429e section.Main-content { padding-left: 0; padding-right: 0; } This segment was the suggested solution but I, like others, did not find that this resolved the issue. /* Text behind play icon */ .sqs-video-icon { z-index: -9999999999999999; }

I tried this but it didn't work. The overlay worked great but when I click on the video nothing happens. The OP to this post has the video working on her site but I'm still too new to CSS/HTML to figure out how to replicate this: https://fish-nectarine-wbzr.squarespace.com/work