Looks very strange on different devices

I totally don’t know what happened. Based on the breakpoints on the webflow designer page, It was supposed to work properly on desktop, but when I check on my macbook pro ( I design product on my pc using wide screen ) they all changed their positions and sizes, I searched other topics, people say maybe should use % rather than fixed px, but I am very new to webflow, I don’t really understand what does it mean.
I changed the layout and some elements’ positons while monitoring the design on my iphone and ipad, they worked pretty well, but what I optimised for macbook pro screen is all failed, the website showing on macbook pro is nothing changed, still messy, any help for this issue?

Thank you for any possible help!


Here is my site Read-Only: Webflow - Asteroid