Page 1 of 1

Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 4:58 pm
by alan_sh
I have a very simple responsive site built with a layout grid. I have 3 views - default, 768 pixels and 320 pixels. When I simulate changing the size using a desktop browser (by shrinking it), the views change just fine. However, if I open the same link on a phone and then turn it to landscape, it remains the same view just in the centre of the screen.

If you want to see it, it's here http://****.gmnscouts.org.uk/wys/index.html - there's only one page.

Any ideas or is this what is supposed to happen?

regards

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 6:03 pm
by Pablo
It is very unlikely that your mobile is only 320 pixels wide, so that probably why the breakpoint is not triggered.

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:15 pm
by alan_sh
Pablo, it does do the tiny size in portrait mode - so that size is OK. What it doesn't do is go to a wider format when I turn the phone to landscape mode.

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:40 pm
by Pablo
This is related to the breakpoints you have added and the viewport of the browser.
If you want to switch to mobile view sooner then you will have to increase the size of the 320 breakpoint or add another breakpoint.

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:48 pm
by alan_sh
OK - let me have a play around with breakpoints But I would have thought 768 was narrow enough for the landscape view (320 is obviously right for portrait as it displays that view correctly).

I'll report back when I've checked it out.

cheers

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:49 pm
by crispy68
Alan,

What sort of phone are you using to view it on?

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:55 pm
by alan_sh
I cut the 768 one down to 512 - no difference.

is it because the phone is only reporting a single size, no matter what I do? If so, is there any way to check this?

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 9:57 pm
by alan_sh
crispy68 wrote: Fri Mar 22, 2019 9:49 pm Alan,

What sort of phone are you using to view it on?
It's a OnePlus5 running Android Pie. Screen resolution is something like 1920 x 1080

When I run window-size from rapid-tables, it reports 732 x 332 in landscape mode and 412 x 652 in portrait mode

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Fri Mar 22, 2019 10:08 pm
by alan_sh
Update. It works in FireFox for Android. It doesn't work for Chrome for Android.

So, not a WYSIWYG issue at all. Don't you just love google!!!

Alan

Re: Phone view doesn't change when turning to Landscape

Posted: Sat Mar 23, 2019 7:30 am
by Pablo
So, not a WYSIWYG issue at all.
Correct, because the browser determines which breakpoints to use.

Re: Phone view doesn't change when turning to Landscape

Posted: Sat Mar 23, 2019 9:44 am
by rogerl
try 380 as smallest bp. Also bp of 480 can be useful. I made that mistake when doing my site.

Re: Phone view doesn't change when turning to Landscape

Posted: Sat Mar 23, 2019 10:40 pm
by alan_sh
Thanks both - I'll experiment and see what I end up with

Alan