Page width

[elpustki]

Hello.
I have the following problem.
I made a page that is 1200 px wide. After publishing, I noticed that horizontally the page does not fit fully on the screen (screen resolution 1600x900). The bottom slider appears in the browser.
I have already checked if there is anything above 1200 px. There is nothing.
Has anyone already encountered this situation?
The site is available at www.mobile-education.pl/NEW/.

[crispy68]

9 times out of 10 it is due to an hidden object outside of the page width.

Another thing i noticed is that you are using several breakpoints where the difference from one BP to the next is very small. I'm don't think this is necessary and will cause extra unnecessary code to be generated in your CSS files.

for example you have

min-width: 1024px to max-width 1099px - this is only a 75px BP.

You also have: 980px to 1023px, 800px to 979px, 768px to 799px, 650px to 767px, 600px to 649px, 480px to 599px, 440px to 479px and 400px to 439px.

10 breakpoints?

[elpustki]

How did you check it?

[crispy68]

How exactly are you implementing the panel menu button in the upper right?

[elpustki]

I'm writing about hidden objects

[elpustki]

That's a sticky layer, orientation: top-right, offset x:25, offset y :25

[crispy68]

Did you use 'render hidden objects' to see if there are any objects outside the viewport? I'm asking about the menu button to make sure it is not the culprit.

[elpustki]

No, I didn't

[elpustki]

I was also thinking about it but the problem is only in the default view

[crispy68]

There are a lot of breakpoints and i notice when i decrease the browser width that at some points i don't see a horizontal scrollbar and others i do. You need to check each breakpoint and make sure all objects are within the boundaries that you set. However, I would say you don't need 10 breakpoints and narrow it down to about half that.

[elpustki]

Due to tablets, ipads and smartphones (including older ones - these were the guidelines of the client), I worked out so much.
If I throw any out, I'm afraid that the site will not be picked up.

[elpustki]

I just checked that even if I throw away all breakpoints, the problem doesn't go away.

[elpustki]

Thanks, you helped me a lot. Hidden objects were the reason they lay outside 1200px.
But tell me how did you see 9 out of 10 of them are out of sight?

[crispy68]

I was just saying 9 out of 10 times the problem is due to a hidden object.

Trust me on the breakpoints...you don't need that many for them to be picked up. I only use max around 5-6 depending on how complex my layout is... sometimes less. I have never had an issue on any phones, tablets or laptops/desktops the site looking bad.

You can always save your project under a different name (creating 2 copies) and then mess with that one to delete the BP's without harming your original project file.

[Pablo]

The horizontal scrollbar is always caused by objects outside the viewport.
In this case, for example:
Layer7 -> 600_komp
offer -> Text_offer_800
But there may be more.

Also note that the ID of an object may not start with a number. '600_komp' is not correct.

[elpustki]

Thanks a lot for help.