I’m building this website that has a video on the background (embedded, not a background video component), and it should have divs that act as buttons on top of certain objects from the video.
I’m ok with the video itself being cropped as all the clickable parts are pretty much in the center but I don’t understand how to position said divs so that they will always remain in place on all screen sizes.
I feel like i’ve tried everything already so really any tip or idea could be helpful
I think I solved it. If anyone comes across this very niche problem – put every button div inside another div which has a defined size matching the video + absolute positioning of 0% top & bottom and auto right & left. Then have the button div also positioned on absolute and manually align it with whatever you need.
Seems to work for my specific case…
Here is my site Read-Only: LINK
The page i’m talking about is “Enter”, and you can see the divs in transparent red.