I'm working on a project for university and have ran into an issue with an embedded youtube video on the landing page. Nothing happens when I click on the play button on the video but when I disable the positioning element on div it works any reason to this? Before I had created the trailer i was using a random youtube video as a placeholder and I never had any issue with this, it is only since adding the trailer for the project that I have ran into issues. This issue occurs whilst working on the site offline and online. heres a link to the website: www.cannonclashgame.com any help would be much appreciated

CodePudding user response：

in your div that contains the iframe for the you tube video, add a z-index:5; Again, that needs to be applied to the div. With absolute positioning you have to keep track of whose on top, z-index will adjust that.

CodePudding user response：

@yig the problem is the top-padding of 30vh on div.releaseInfo. The simplest way to fix this would be to move your positioning to the parent div.gamePreview.

You can manage your responsive behaviour there.