Numbers not moving when resizing the page

Hi everyone. So I have a div with a left-aligned heading and a number right-aligned. These numbers are outlined and when you hover on them they get filled. My problem is that when hovering over one of the main divs and then resizing the page, the number will stay in the same place, and everything else (including the numbers of the divs you haven’t hover yet) will re-size accordingly.

Tried a couple of things like having all the properties on % or vw, or giving it a 1px right-padding to keep it always inside the div, but still, nothing works.

Here is a read-only (this is not my main project, the client requested to not show the page even for the forum so I copy the part I’m having trouble into a new project)

https://preview.webflow.com/preview/menu-try?utm_medium=preview_link&utm_source=designer&utm_content=menu-try&preview=49bf299ffa544414c2e98b421f2b3bcb&mode=preview

Thank you in advance


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

My problem is when I resize the webpage the location of some elements get … Ive not investigated your css to fix it, I think you would better first reorganize the html.

Hi William,

Do you mind explaining a little bit more what you mean? I know the HTML is very rusty, I had to copy-paste it from my original project and some elements like the hover images and more are missing, or no section wrapper etc. In my original project the HTML it’s a lot more organized.