Hi All, I’d like get help with different views between the preview mode and the designer mode. Here are the screenshots.
Here is the preview link. https://preview.webflow.com/preview/verbleifs-new-project?utm_medium=preview_link&utm_source=designer&utm_content=verbleifs-new-project&preview=b66969f891d6ba7a5603e6714c8c761d&workflow=preview!designer view|690x336
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Hey @Sabbir , this is due to different display scale sizes.
In your designer, you will notice it is 1920 @ 59.1% whereas in preview mode, it is 1920 @ 82.3%. Always make sure the scale is 100% while designing to be safe.
Thank you very much for your kind help. Now I’m trying to set it 100%. But, why it’s not increasing. Am I doing any wrong?
Hello @Sabbir, you can’t scale it up if you set the width of the designer (the number on the left of the scale) to be more than the actual available width
I really need help with this. 
Hey @Sabbir , a quick workaround to fix your issue with the overlapping image would be to set your hero-content-image to absolute-bottom with these parameters. Make sure you are in the MAIN DESKTOP BREAKPOINT for this to reflect across your other created breakpoints.
Also, switch the width of these images from % to px instead. 700px for the Main Breakpoint and tweak from there. Since you were using %, as the screen gets wider, so does the image and therefore will overlap your text.
Also, I am not a huge advocate on managing all these custom breakpoints and prefer to only work on the main breakpoint. If you want to get rid of the breakpoints, you can look at @Finsweet 's new extension below.
Thanks again for your kind help. Also the for the extension. I’d really love to have a look.
