Integrated buttons into my background but can't get buttons/links to adjust to different resolutions

I have a very simple one page design and as a result I decided to integrate my buttons with the background image so it looked that little bit cooler.

I have worked on the webflow website on my laptop and it all looks/works perfectly in that resolution but the minute I switch to my desktop (27" screen), the resolution of the page adjusts the place I put the div/link (over the background button) and the link ends up being half way up the page instead of over the button.

Is there any way to make divs/link blocks positioning stay in the same position when people with different resolutions visit the site?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Would it help if I said please?

Can you post your share link? We can’t see your project

Thank for your reply @mackshirilla

Here you go:
https://preview.webflow.com/preview/ozscape-secondproject?utm_source=ozscape-secondproject&preview=3c67236325daea68afef7d9d2985c0bb

Sorry if my text didn’t make sence

Regards,

Is my issue making sense? is there a solution to this?

I do not think this is possible in the current implementation of the background. Why don’t you create a block with actual buttons from those that are already drawn and position it somewhere at the bottom? It won’t align perfectly but it’ll do the job.

Thanks for your reply @dram

That’s a shame, it really would’ve looked better if I was able to achieve this.

I did have the buttons uploaded as a picture in their own block however then the block just kept moving to placed on the page that I didn’t want it; it’s honestly one of the real let downs of Webflow.

I do not think any developer would be able to do what you want to do with just html and css. There is no way to keep site being responsive and at the same time have fixed elements exactly where you want them. At least I cannot think of a way to make it work.

@dram just spit balling here but…what if I split the background into 5 pieces and then created 5 divs and uploaded each piece into the div

The block would then be subject to a lot less space to move around, correct?

Think this would work?

I am sure this will create noticeable lines that will shift your graphics half a pixel here and there on some resolutions and on some windows sizes. You can try of course, it is interesting if you will be able to solve the problem!