Page width

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
elpustki
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Page width

Post by elpustki » Thu Oct 03, 2019 7:15 pm

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/.

User avatar
crispy68
 
 
Posts: 1056
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Page width

Post by crispy68 » Thu Oct 03, 2019 7:24 pm

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
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:33 pm

How did you check it?

User avatar
crispy68
 
 
Posts: 1056
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Page width

Post by crispy68 » Thu Oct 03, 2019 7:35 pm

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

elpustki
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:35 pm

I'm writing about hidden objects

elpustki
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:38 pm

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

User avatar
crispy68
 
 
Posts: 1056
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Page width

Post by crispy68 » Thu Oct 03, 2019 7:39 pm

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
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:40 pm

No, I didn't

elpustki
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:41 pm

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

User avatar
crispy68
 
 
Posts: 1056
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Page width

Post by crispy68 » Thu Oct 03, 2019 7:42 pm

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
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:46 pm

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
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 7:49 pm

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

elpustki
 
 
Posts: 20
Joined: Wed Sep 05, 2018 8:45 am

Re: Page width

Post by elpustki » Thu Oct 03, 2019 8:01 pm

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?

User avatar
crispy68
 
 
Posts: 1056
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: Page width

Post by crispy68 » Thu Oct 03, 2019 8:14 pm

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.

User avatar
Pablo
 
Posts: 21560
Joined: Tue Mar 28, 2006 12:00 pm
Location: Europe
Contact:

Re: Page width

Post by Pablo » Thu Oct 03, 2019 8:26 pm

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.

Post Reply