Page scrolls horizontally on mobile

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
Post Reply
lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 3:05 am

I've tried everything to fix this but have not been able to figure this out.
I can move the website left and right on my phone. Has anyone experienced this?

http://www.analunaphotography.com/

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

Re: Page scrolls horizontally on mobile

Post by Pablo » Tue Oct 30, 2018 7:14 am

When there is a scrollbar at the bottom of the page this indicated that there are object outside the viewport/page boundaries.
For example: ResponsiveMenu

Related FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
(There is a large is empty space at the bottom (or right side) of my page.)

Also, Layer1 seems to have conflicting settings. But I cannot see exactly what you have done based on the HTML code,.

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 1:26 pm

Here are the settings for layer 1. I did not make any changes in the other layer 1 tab settings.
Only in the General tab. Also, I can see no other objects outside the viewport/page boundaries.

http://www.analunaphotography.com/Notes.html

Image

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 1:40 pm

Also, when I change layer 1 from Sticky Layer to Floating layer its fine.

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

Re: Page scrolls horizontally on mobile

Post by Pablo » Tue Oct 30, 2018 1:45 pm

Please uncheck 'Keep original position'

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 2:25 pm

I unchecked "keep original position" but that didn't work....plus doing that puts the
menu on the top of the page. Here is the site, published with the change you suggested.

http://www.analunaphotography.com/

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

Re: Page scrolls horizontally on mobile

Post by Pablo » Tue Oct 30, 2018 3:02 pm

To be able to help you I need a copy of your project because I cannot see what you have done based on the published page.

Related FAQ:
https://www.wysiwygwebbuilder.com/forum ... 10&t=82134

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 10:06 pm

Thank you....Here is the project file:

https://drive.google.com/open?id=1fxFV4 ... r2TuKCv3he

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

Re: Page scrolls horizontally on mobile

Post by crispy68 » Tue Oct 30, 2018 10:27 pm

Here are a few things to fix which should fix your issue:

1. In Page Properties, Page Alignment should not be 'center horizontally' when using floating layers/layout grids. Change to 'do not center this page'.

2. Your bookmarks on the 768 and 320 bp's are outside of the page width. reset their positions within the borders you've set.

3. I recommened using 'include 'min-width' in CSS3 media queries'. Click on 'manage breakpoints' and check the box.

4. You will still see there is a bit of a space bar at the bottom. This is due to the fact of the vertical scrollbars. Go to page properties -> Advanced -> change 'overflow-x' from None to Hidden.

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Tue Oct 30, 2018 11:57 pm

Thanks so much for all those tips. #4 fixed the horizontal movement when previewing in wwb.
Unfortunately when looking at it on an actual phone I still have horizontal movement.

When looking at it on my phone The carousel is off center pushing up against the left side of the page
and the responsive menu bar that is inside the sticky layer doesn't go all the way across and is sticking out
past the carousel a bit on the right side.

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

Re: Page scrolls horizontally on mobile

Post by crispy68 » Wed Oct 31, 2018 1:04 am

There is something jacked up with the carousel you have. I'm not sure what exactly is wrong with your original one but I would suggest remaking the carousel and delete the one you have. When I rebuilt it from scratch using your images, it worked just fine. Also, make sure you use web safe image names. Some of the images you have named were: 1.jpg.jpg

I would give it a more descriptive name or at least start with a letter: image1 (should look like image1.jpg) and not have .jpg.jpg

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Wed Oct 31, 2018 5:13 am

I found what the problem was.
I had to set the layout grid properties to "column height" = auto
and "Grid System" = default. now it is fine.

The other problem I have is, there's a white space to the right of the carousel header.
I've tried all that I can think of and I cant get it to go away.

https://drive.google.com/open?id=1E0juO ... j7mU7Zqjp2

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

Re: Page scrolls horizontally on mobile

Post by Pablo » Wed Oct 31, 2018 7:03 am

In Tools->Options->HTML uncheck 'Keep inline styles of Responsive Web Design'.

lunatunes
 
 
Posts: 12
Joined: Tue Apr 04, 2017 12:36 am

Re: Page scrolls horizontally on mobile

Post by lunatunes » Wed Oct 31, 2018 8:30 pm

Thanks Guys so much for your help!! The more I use and get to know this builder, the
more and more I love this thing!
Yes, there is a learning curve. But I do believe that if you learn how this builder works
you can build amazing sites without the restrictions of other web builders.
Plus, the quick help you get on this forum is second to none....and that's not an
exaggeration.
Randy

Post Reply