Viewport fitting issues | horizontal scrollbar

Hi everyone,

Can someone spot why my website is not fitting the viewport on desktop? There’re a few extra inches at the right side but I’m failing to determine the cause.

It only appears on the published site and not on preview mode.

Thank you very much!


Here is my site Read-Only: [LINK][1]

chrome_j0826vdRN6

Make a new div “page-wrapper” and move all content into that. Remove all the style from it and make it “overflow hidden”.

1 Like

This worked! Thanks a lot.

Now I ran into another issue. The Navbar is set to Sticky but it won’t work inside the page wrapper because it’s overflow hidden… but if I put it outside the wrapper, the background image is not visible on it and also the horizontal scrolling issue comes back.

You can set the navbar “fixed”. then give a “page-wrapper” a 8vh top padding as your navbar is set to 8vh. and “overflow hidden” on page-wrapper.

If you wanna keep the black background on navbar in the beginning you can set animation on scroll.

0% navbar background black → 1% navbar background transparent

ezgif.com-gif-maker

1 Like