I think I see what you mean, I have noticed this too. Since the designer is always smaller than a fresh window, depending on spacing settings (especially when using percentage values) your spacing will change because the size of the window has changed. This is just how spacing on the web works.
You can offset your issue on mobile by using more precise positioning with your background image here:
I actually have been trying to adjust the background image through the position settings panel you pointed out, the issue is what i set on the designer looks different than what im seeing on the published site, so whatever position i try to set it just does not look the same .
Also, there is something wrong with the drop NavMenu apart besides the desktop version, maybe you’re able to know whats wrong?
Thanks in advance for the time you set aside trying to help me out and for anyone that sees this topic, any help is appreciated!
In regards to background image positioning, the difference in positioning you’re seeing is due to the combination of 1-the positioning of the background image using that panel & 2-the browser window. For example if you left align the background image by selecting the arrow pointing directly left, you will see more or less of the image on that published site depending how long (horizontal) that div is. This is just how positioning images works when using background images. You cannot guarantee that the user will see the same thing you are seeing unless they are using your machine. Sorry for if this is hard to understand, I may not be saying it in the most direct way.
Regarding the drop nav, please further explain because to me, the full nav appears on desktop sites & the hamburger menu displays on mobile. I’m just unsure of what you want to accomplish.
****Just in case this helps, you can change at what breakpoint elements appear by first selecting that element (ex. NavBar) and going to the setting panel (gear icon). You’ll find this option at the top with little images of each breakpoint.
