[Resolved] Potential bug

[Garth Dryland]

Hi Tom

I came across a potential bug today. I have tested it on Microsoft edge, Firefox and Chrome.

On Firefox and Chrome when you make a GP page 1025px the site acts like its in mobile view.

I realise this is a typical @media break point however I wouldn’t expect this to happen unless that break point has CSS corresponding to it and in these two cases I don’t believe it does. I know my site doesn’t and based on what your site does format wise, I don’t believe it does either.

You can check it out on my site accountwise.co.nz and on your own site generatepress.com

When you use something like responsivepx.com it makes it easy to see. Just disable show scrollbar.

Keen to hear if there’s a fix for this.

Cheers

[Tom]

Hi Garth,

I’m not seeing it?:
http://screencast.com/t/C0domtCrIzgj
http://screencast.com/t/vQitpH5pxwDi

Also, if you open the Inspect element tool in Chrome, and resize your browser down to 1025px, it looks good to me?

Maybe I’m misunderstanding?

Let me know 🙂

[Garth Dryland]

Hi Tom

I don’t see the issue from the chrome inspect element tool however I do see it from the chrome browser (firefox) as shown here.

https://1drv.ms/f/s!AjEGKOtzUwy1_V0vJGvX4lFcvekS

I can also make chrome (firefox) show the sites the same as http://responsivepx.com does. http://www.isresponsive.com also provides the same result.

I just sent screenshots of your site as the add-ons page provides a good example of what i mean.

Cheers

[Tom]

That’s so weird, here’s what I get with the same settings: http://screencast.com/t/3ZujXtbEQ

That add to cart button needs some work, but I’m definitely not getting the same results as you in any of my browsers.

Maybe someone else can give it a try if they’re reading this..

[Garth Dryland]

Hi Tom

Just in case others test this;

I just tried testing on my Android 10.1 note (2014) tablet and I don’t get the issue on that device.

I also tried on my old Toshiba L500 laptop (which I now use as a media server) and no problem there either. I upgraded this device from Windows 7 Pro to Win 10 Professional.

I seem to only have the problem on my ASUS N550JK laptop. This device has been upgraded from Windows 8.1 Home to Windows 10 Home.

I also tried on my wife N55JK and while it still has the problem directly via browser it doesn’t when running site through responsivepx.com whereas my N550JK does.

Weird

Suggestions welcomed

[Bishop]

I”m seeing what Tom is seeing. Everything seems to be normal.
Looks like the add to cart button is fixed as well.

[Tom]

I wonder if it has something to do with resolution?

Super strange, from a coding stand point I don’t see how it’s possible.

I’m not getting it at all on my desktop on either of my 3 screens.

My wife also isn’t getting it on her ASUS laptop.

[Garth Dryland]

@bishop

Thanks

I suspect its some sort of bug. Its possible there’s a video driver issue or something like that. ASUS is potentially lagging in this area post Windows 10 release.

PS the Add to Cart tweak looks good Tom

[Garth Dryland]

Hi Tom

Somehow missed your reply earlier.

I tried resolutions a few hours ago. After I got your email though I got to thinking that I changed the chrome default zoom size to 125% given its viewport looks smaller than that of the Edge and Firefox so I went and reduced it back to default 100% and bingo, problem gone. As for Firefox its still doing it.

Interested to know if your (and others) devices have this chrome issue with zoom size of 125%, if you get a moment.

Chrome is by far the most widely used browser so glad to sort it on chrome.

This revelation has also resolved two other issues I hadn’t yet raised because I had a feeling they may be connected though I wasn’t sure and I tore apart all my new css over the last 2 days trying to nut this out. Its a relief to find out my CSS isn’t the reason. Phew 🙂

[Tom]

Ah, that’s very interesting! I’ll do some research on this and see what I can do to fix it 🙂

[Garth Dryland]

Hi Tom,

Awesome. A fix would be fantastic.

I set Chrome to 125% zoom on my media server after my last message and I could recreate this problem.

I still have no idea as to why Firefox does this though. Hopefully something comes to light.

Cheers

[Tom]

I couldn’t get it to happen in Firefox at all, even zoomed in.

[Garth Dryland]

Hi Tom,

This morning I stumbled on something similar happening with Firefox as in Chrome, by accident.

On my Win 10 ASUS I have a setting in Start/Settings/System/Display which alters the size of text and apps etc. I had set this to 150% after finding out it sorted my issue with Chrome. This morning I discovered it also impacted Firefox. So I went through the process of changing this and testing running through various browser zoom percentages and the issue occurred at various percentages.

For example with a display magnification of 125% (STD on my ASUS) I have an issue with Firefox at the browser percentage of 100% however if I set the ASUS display setting to 150% zoom Firefox displays the sites correctly with browser zoom of 100%. There are numerous variations of this happening depending on the display zoom and browser zoom (On my HD ASUS I can zoom the display between 100-175%, with 125% being both the recommended and the optimal user experience). It also appears a restart between computer display zoom settings is required for the result to be replicated.

Cheers

[Tom]

Super strange, you’re basically seeing a bug with CSS media queries, used on tons of sites.

I have a couple ideas to try to fix it, I’ll play around with them for the next version.

[Garth Dryland]

Awesome Tom

A solution to it would be great. Its really annoying me. I keep swapping zoom ratios between what I like to use and what I need to use to avoid having the problem.

Cheers

[Author]

Posts