problem in my site

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
wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

problem in my site

Post by wb_user » Sat Sep 09, 2017 3:51 pm

hello
i check my site in responsive checking websites.
please look at this : https://goo.gl/8jAX3h
how i can fix my responsive problem ( scroll in width )
my website URL : https://goo.gl/UnMGdq
thanks.

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

Re: problem in my site

Post by Pablo » Sat Sep 09, 2017 4:03 pm

Can you please be more specific?
What do I need to do to see the problem?

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sat Sep 09, 2017 4:09 pm

Pablo wrote:
Sat Sep 09, 2017 4:03 pm
Can you please be more specific?
What do I need to do to see the problem?
see this pic.
https://ibb.co/ciBSGv
i need to remove this scrollbars from page with standard display on most monitor regulations like 1280x1024

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

Re: problem in my site

Post by crispy68 » Sat Sep 09, 2017 5:20 pm

Under page properties, on the Miscellaneous tab under the Advanced sections, choose 'hidden' in the first dropdown for overflow-x/y and see if that helps. If it doesn't, then it means you have an objects outside of the boundaries.

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

Re: problem in my site

Post by Pablo » Sat Sep 09, 2017 5:33 pm

The browser will display scrollbars if there is content outside the viewport.
Solution: make sure all content is inside the view port.

Note that it is impossible for me to go through thousands of lines of code to figure out what you have done.
My advise is to use the browser's debugger and walk though all elements. Then you will notice that there are several items which are not within the viewport.

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sat Sep 09, 2017 10:24 pm

Pablo wrote:
Sat Sep 09, 2017 5:33 pm
The browser will display scrollbars if there is content outside the viewport.
Solution: make sure all content is inside the view port.

Note that it is impossible for me to go through thousands of lines of code to figure out what you have done.
My advise is to use the browser's debugger and walk though all elements. Then you will notice that there are several items which are not within the viewport.
i fix all content outside the viewport. in this page but scroll not remove on page

User avatar
BaconFries
 
 
Posts: 4493
Joined: Thu Aug 16, 2007 7:32 pm

Re: problem in my site

Post by BaconFries » Sat Sep 09, 2017 10:31 pm

Maybe you are viewing a cached version that still shows the scrollbar.

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sat Sep 09, 2017 11:00 pm

please see this page : https://goo.gl/aB4Z34
without any errors : https://goo.gl/zJ6pMB
https://goo.gl/qnjq4a
but when i check responsive will see scroll : https://goo.gl/mjfbsr

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

Re: problem in my site

Post by Pablo » Sun Sep 10, 2017 7:12 am

You can use the browser's debugger to figure out which objects are outside the viewport.
Or else simply remove all objects one by one until you have found the one that is activating the scrollbar.

Tip: if you use a full width layer (100%) and add a border then you will have to set 'box-sizing' to 'border-box' otherwise the border width will be added tot the total width of the layer.

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sun Sep 10, 2017 9:26 am

Pablo wrote:
Sun Sep 10, 2017 7:12 am
You can use the browser's debugger to figure out which objects are outside the viewport.
Or else simply remove all objects one by one until you have found the one that is activating the scrollbar.

Tip: if you use a full width layer (100%) and add a border then you will have to set 'box-sizing' to 'border-box' otherwise the border width will be added tot the total width of the layer.
If i send my project to your email , can you check and tell me what i do for resolve that problem exactly ?

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

Re: problem in my site

Post by Pablo » Sun Sep 10, 2017 11:51 am

I'm sorry but you will have to learn to solve these type of problems yourself.
For me it may also take several hours to figure out what you have done.
I can help you with a simple page when there are only a few objects, but with pages with hundreds of lines of code it will be too much work for me.

You can use the browser's debugger to figure out which objects are outside the viewport.
Or else simply remove all objects one by one until you have found the one that is activating the scrollbar.

Tip: if you use a full width layer (100%) and add a border then you will have to set 'box-sizing' to 'border-box' otherwise the border width will be added tot the total width of the layer.

Another solution may be to increase the values of your breakpoints few pixels so it switches to the smaller viewport sooner.
For example, use 768 + 16 (because it looks like the layout 'breaks' at that value)

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sun Sep 10, 2017 4:34 pm

Pablo wrote:
Sun Sep 10, 2017 11:51 am
I'm sorry but you will have to learn to solve these type of problems yourself.
For me it may also take several hours to figure out what you have done.
I can help you with a simple page when there are only a few objects, but with pages with hundreds of lines of code it will be too much work for me.

You can use the browser's debugger to figure out which objects are outside the viewport.
Or else simply remove all objects one by one until you have found the one that is activating the scrollbar.

Tip: if you use a full width layer (100%) and add a border then you will have to set 'box-sizing' to 'border-box' otherwise the border width will be added tot the total width of the layer.

Another solution may be to increase the values of your breakpoints few pixels so it switches to the smaller viewport sooner.
For example, use 768 + 16 (because it looks like the layout 'breaks' at that value)
hello pablo
i check your words , bot not work for me.
please see this small example project and help me for my problem
if this project scrollbar fix , then my original problem fix too
https://www.dropbox.com/s/wshq6dhc4ey774l/22.zip?dl=0
thanks

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

Re: problem in my site

Post by crispy68 » Sun Sep 10, 2017 5:11 pm

In your demo, on the 320 breakpoint, the word 'Footer' is outside of the viewport.

Also, why is your default smaller than your next breakpoint? Your default view should always be the largest. In your demo, default should be 1280px with bp's of 970 (which is your current default), 768 and 320.

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

Re: problem in my site

Post by Pablo » Sun Sep 10, 2017 5:22 pm

The problem is related to the borders of the layer(s).
The full width layer is 100% and the border will be added to that size, making it wider than 1280 pixels.
The reason why border-box does not work in this case is because the content of the layer is centered, which results in a negative margin.
Solution: remove the border.

Also note that the default view should be the widest view. There is no need for a 1280 breakpoint.

wb_user
 
 
Posts: 247
Joined: Sun Jul 05, 2015 7:03 am

Re: problem in my site

Post by wb_user » Sun Sep 10, 2017 6:12 pm

Pablo wrote:
Sun Sep 10, 2017 5:22 pm
The problem is related to the borders of the layer(s).
The full width layer is 100% and the border will be added to that size, making it wider than 1280 pixels.
The reason why border-box does not work in this case is because the content of the layer is centered, which results in a negative margin.
Solution: remove the border.

Also note that the default view should be the widest view. There is no need for a 1280 breakpoint.
please send fixed version of that project for me
(sorry for my english)

Post Reply

Who is online

Users browsing this forum: Exabot [Bot] and 3 guests