Mobile View Width too small

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
User avatar
Starb7
 
 
Posts: 281
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Mobile View Width too small

Post by Starb7 » Tue Apr 20, 2021 4:14 pm

Hi Pablo

Looking for help and advice again! I am sure I have done something daft and so I have looked through the forum and help pages to no avail.

Basically, I have redone this site http://swainelectronics.co.uk/ to a fluid one using Cell Grids and uploaded it here http://swainelectronics.co.uk/preview/ The site needs some polishing and tidy up but overall works as expected apart from one area which I cannot find.

If you view the site on a mobile phone/device it loads fine and seems to 'fill' the width as expected but you can pinch-zoom the width to a slightly smaller width when i suspect I should not be able to. I presume there is an element there which is outside the viewport which artificially is giving the wrong page width, but I cannot see it in the project. So, any ideas on here to look for the issue? Happy to upload the project if that helps?

TIA

Paul

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

Re: Mobile View Width too small

Post by Pablo » Tue Apr 20, 2021 5:48 pm

The page does not have any breakpoints so a mobile browser will display the desktop version.

User avatar
Starb7
 
 
Posts: 281
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Mobile View Width too small

Post by Starb7 » Wed Apr 21, 2021 4:25 pm

Pablo wrote:
Tue Apr 20, 2021 5:48 pm
The page does not have any breakpoints so a mobile browser will display the desktop version.
Hi Pablo

That's right, as it uses the Cell Grid system and so 'shrinks to fit' which for the site, appears to work fine. I just having a problem working out why the mobile (even if a reduced desktop) version is not fitting into the width of the device it is viewed on?

Do you think that if I added a Breakpoint, say 480px, for mobile devices, that would sort it?

Cheers

Paul

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

Re: Mobile View Width too small

Post by Pablo » Wed Apr 21, 2021 5:20 pm

For me, it seems to work correct.
There is no scrollbar at the bottom of the page, so there are no object outside the viewport as far as I can tell.

User avatar
Starb7
 
 
Posts: 281
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Mobile View Width too small

Post by Starb7 » Wed Apr 21, 2021 5:30 pm

When I initially load the page, it 'fills' the width but I can pinch-shrink/zoom the page so i presumed there was something off-screen?

I have done a 'select all' in the project to show up any object handles but can't see anything off the page. Is it worth me uploading the project?

Thanks for your help.

Cheers

Paul

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

Re: Mobile View Width too small

Post by Pablo » Wed Apr 21, 2021 5:48 pm

This may be helpful:
"There is a large is empty space at the bottom or right side of my page"
https://wysiwygwebbuilder.com/forum/vie ... 10&t=63817

User avatar
Starb7
 
 
Posts: 281
Joined: Tue Sep 05, 2006 12:35 pm
Location: Derbyshire

Re: Mobile View Width too small

Post by Starb7 » Thu Apr 22, 2021 4:29 pm

Hi Pablo

I have re-read that and I could not find anything particularly relevant and so have have been 'playing' with the site and found this. Perhaps you can advise why it works so I can 'do it correctly' rather than fudging it.

I have found that Google recommend mobile devices use breakpoints/screen widths as 360px (320 too small and probably obsolete now) and 480 is really tablet/landscape sizes.

I found that the culprit was the Responsive text Menu, ie if I removed it, the problem goes away, no need to set breakpoints* or anything like that. But, I need a menu and so put it back and started tweaking that. I changed the font from Verdana (which should be web safe) to Ariel. I then set a RWD point of 360 in the menu properties and set the max width of the object to 359 in the Properties Inspector.

* I thought, maybe misread, that you don't need to use Breakpoints if the site is using Cell Grids as they 'looked after' the responsive bit. Is that wrong?

I have NOT added a breakpoint in the project and then uploaded it. Now if you take a look, you can see it fits the page exactly and you cannot pinch to shrink it. Note that you may have to do a 'refresh' to load the new code (sorry, grandmother - suck - eggs) and see that it all fits fine.

So, is the issue the menu code and formatting or am I still way off the mark?

Cheers

Paul

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

Re: Mobile View Width too small

Post by Pablo » Thu Apr 22, 2021 5:22 pm

If you need further assistance then please share demo project. I need to see the context of the menu.

Note: I do not need the complete project, only a simple demo with one page and the menu.
Related FAQ:
viewtopic.php?f=10&t=82134

Post Reply