1250657 - A left margin appear about 25px, it seems to affect all websites I visit which are responsive when you resize the browser down to its smallest size

Status: NEW

(Core :: Layout, enhancement, P3)

Description

[Mr Glyn Thomas [:mrglynthomas]]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/600.8.9 (KHTML, like Gecko) Version/6.2.8 Safari/537.85.17

Steps to reproduce:

Sorry I do not know what version option box means … this is the latest version of firefox 44.0.2 for Apple Mac.

The bug seems to appear after a couple of days, I am developing a simple website and I have not noticed any specific steps that reproduce this bug.


Actual results:

A left margin appear about 25px, it seems to affect all websites I visit which are responsive when you resize the browser down to its smallest size.

The next time it happens I will screen record it and can post it to you, let me know if this would be helpful.


Expected results:

I also cross browser test the website in chrome and safari and they don't seem to be affected by this problem.  I also have older versions of firefox and they seem unaffected, however, I have not soak tested them in the same way, in that they are not running for several days with this website under development.

Comment 1

[Loic]

Could you attach a screenshot, please.

In addition, is it reproducible:
1) in safe mode:
https://support.mozilla.org/en-US/kb/troubleshoot-firefox-issues-using-safe-mode

2) with a fresh profile:
https://support.mozilla.org/en-US/kb/profile-manager-create-and-remove-firefox-profiles

Comment 2

[Mr Glyn Thomas [:mrglynthomas]]

I am not signed into Firefox, so I guess no profile.  Safe mode, good question I use;

- colorzilla 2.8
- firebug 2.0.14 
- ghostery 6.0.0

and have an old yslow 3,1,8,1 which I don't think works any more ... :)

I have almost completed all the client side dev for this website so will disable everything tomorrow and monitor the situation … I guess safe mode does the same thing?

Next time it happens I will video screen cast it as it affects every website you browse to, clear history, refresh page, bug still present … only way to get browser back to expected behaviour is to shut down and restart it!

Good questions, as it could be a problem with one of these add on's.

Comment 3

[Paul Pasca[Away. Please needinfo? Paul Oiegas [:pauloiegasSV]]]

Hi Glyn,

You don't need a Firefox account to be logged in in order to test this with a new clean Firefox profile. If you follow Loic's link, you will see what Firefox profiles are about.

And yes, a screen recording will be very useful. Did you have the chance to test again and record? Did the issue reproduce in safe mode? Can you please provide your results once you have them? Also, a minimal test case with your website could be helpful.

Thanks,
Paul.

Comment 4

[Mr Glyn Thomas [:mrglynthomas]]

Hi Paul

Many thanks, Ok then the answer is I use / used a fresh profile.

Apologies, I have not checked for the bug for a while as I am developing the server side for a website, and have not removed any of the add-on's as I prefer to use firefox to develop then check in chrome and safari as I have done for a while now without this firefox bug being present.

However, I have just noticed that I have the bug back again, I will find some responsive websites and load them into chrome and safari and firefox and screen record to demonstrate the bug.

If you email me back with some specific responsive sites you want me to load into all the browsers before I start screen recording this please let me know, please let me know where and who to send this screen recording too when completed.


Thanks,
Glyn.

Comment 5

[Mr Glyn Thomas [:mrglynthomas]]

… aaarrrhh … I was just loading up a couple of well known responsive websites to demonstrate this bug in the screen recording and while clicking around the tabs in firefox to show you what the bug looks like … this action fixed the bug! All websites appear as they should … maybe this information is helpful.

I will keep looking for the bug, from time to time …
 

https://webflow.com/, http://digg.com/ and https://www.mozilla.org/en-GB/

are websites that are good to demonstrate the bug, on the mozilla webpage at the smallest size you are not meant to see any greyed out faces, with the bug in operation, from memory, you do on the left hand side and the text on the right is cut off !

Comment 6

[Paul Pasca[Away. Please needinfo? Paul Oiegas [:pauloiegasSV]]]

Attachment: test.png

Hi Glyn,

I believe that I understand what your issue is about. Firefox allows you to resize the window to a smaller size that the webpage content needs. Chrome can't be resized to a smaller size that the web page allows(see attachment, both browsers are resized at the smallest width). That's why Firefox has a horizontal scroll bar and a 25px margin to the right. This happens on both the latest release(42.0.2) and on the latest Nightly(47.0a1). Firefox has the same behavior on Windows 7 x32.

User Agent: Mozilla/5.0 (Windows NT 6.1; rv:44.0) Gecko/20100101 Firefox/44.0
Build ID: 20160210153822

User Agent: Mozilla/5.0 (Windows NT 6.1; rv:47.0) Gecko/20100101 Firefox/47.0
Build ID: 20160229030448

However, this can be reproduced on Chrome as well if you go to http://getbootstrap.com/ and resize Chrome's window to the smallest size. After that, if you paste another URL in the address bar(https://www.mozilla.org/en-GB/), Chrome will keep the same window size, but will have the same behavior as Firefox: a horizontal bar and 25px to the right.

This is more related on how a website is implemented, since http://getbootstrap.com/ allows both browsers to be resized at the same size, without a horizontal scroll bar and 25px margin to the right. I believe this can be considered an enhancement on Firefox's side, rather than an actual bug.

Considering this, I will set the importance of this bug as an enhancement, mark this issue as New and assign the appropriate component. If anyone considers that the component is not the right one, please change it to a more appropriate one.

Thanks,
Paul.

Comment 7

[Mr Glyn Thomas [:mrglynthomas]]

Hi Paul

I have read your feedback and have followed your example and checked out your attached image, this is not what I have experienced, the browser changes behaviour, in the most recent example, as I was preparing a screen cast for this bug report I clicked on a couple of the tabs to load up some websites to demonstrate what I am seeing, however this action seemed to reset the browser back to its previous small screen view as demonstrated by viewing the https://www.mozilla.org/en-GB/ page which I assume is designed so that the blocks of colour for firefox small screen view are perfectly in the middle when firefox is used to view this page.  When the bug is in operation this is not the case and you see the greyed out face on the right hand side about 25px as discussed, I am sorry I am not a web designer so it may not be 25px.

I appreciate this is not a major problem and I apologies in advance if this problem is a problem that only I am having, I do not have a lot of time right now, but I will screen cast it next time it happens as discussed ( four times so far ), do you still want me to screencast what I observe?

Thanks,
Glyn.

Comment 8

[Loic]

You can attach a screenshot of what you see, no need to attach a full video.

Comment 9

[Mr Glyn Thomas [:mrglynthomas]]

Ok, great will do, I only thought of a video as this would show that it makes no difference what you do to resize the browser or refresh the page the resultant behaviour when you resize the browser to its smallest area is the same … many thanks Loic

Comment 10

[Mr Glyn Thomas [:mrglynthomas]]

I will send a screenshot then next time this enhancement appears, in the meantime, I better get back to work and fix my own enhancements :)

Have an enhancement free day }:-( 

Thanks,
Glyn.

Comment 11

[Mr Glyn Thomas [:mrglynthomas]]

It has been a couple of days now, I will continue looking for the issue, but nothing so far.  The reason for writing this note is as it would seem that no one else to my knowledge has experienced this problem so I thought it maybe helpful to tell you the following added information ;

- I always have the browser with a number of other websites open at the same time. ( not helpful I know )
- I am not using javascript in responsive / adaptive web design, but other sites may.
- The browser is reset to normal behaviour when interpreting CSS by the action of loading / selecting ( clicking on ) other sites using the tabs.
- The bug seems to be activated when the browser is not at its smallest size.
- When the bug is active the browser does not seem to exhibit any other odd behaviour except for resize to its smallest size.

Although guess work can be unhelpful, and my guess may fit into this category :) My guess is this is a memory pool state problem, the memory pool that deals with interpreting CSS, specifically media queries when the browser is sized to the smallest size.  This memory pool either leaks, or maybe is triggered into this invalid memory pool state.

I hope this information helps.

Thanks,
Glyn.

Comment 12

[Paul Pasca[Away. Please needinfo? Paul Oiegas [:pauloiegasSV]]]

Hi Glyn,

Thanks for your interest in helping us to understand and solve this issue. If no one else is able to reproduce this issue, it may be something specific to your environment. Can you please investigate further this issue and come back with your results when you have them?

Thanks,
Paul.

Comment 13

[Mr Glyn Thomas [:mrglynthomas]]

Hi Paul,

My environment has deliberately not changed over many versions of firefox (or my add-on's) and other browsers I use for this very reason, but as discussed previously I cannot discount an environment (add-on) problem.

A memory pool leak would be trickier to pin down, but this error state being triggered either by a signed approved firefox add-on or by a line of javascript, would be interesting.

I will continue looking for this issue, but it maybe sometime, as I guess like everyone, projects need to get delivered in a timely manner.

Thanks,
Glyn.

Comment 14

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

It sounds like we'll need some more data from the reporter before we're able to reproduce the issue here.

Comment 15

[Mr Glyn Thomas [:mrglynthomas]]

To Everyone, many thanks for your advise and feedback, I did continue to check for this bug as I developed this website app, I think I became maybe a little bit paranoid ( after the first 3 or 4 times this layout bug appeared ) that it was something in my javascript or CSS or platform environment that was causing this layout bug issue, but it did not appear again !

Firefox has now moved onto version 45.0.1 for mac and this site is finished and will launch soon.

Just in case this type of layout bug has been found and fixed elsewhere in Mozilla please send me a tweet @glynthom or email [e-mail].

Please feel free to archive or close this bug report.

Many thanks again,

Glyn.

Comment 16

[Mr Glyn Thomas [:mrglynthomas]]

Attachment: firefox-layout-bug.png

Please find attached a snapshot of the firefox layout bug.

This bug is in the latest version of firefox 45.0.1 for mac and can be observed when active when the browser is resized as small as it can be, as an example I took a snapshot of the browser displaying the mozilla page which is incorrect.

This bug was also in the previous version for mac when I reported it.

The mozilla page should correctly display; no grey parts of the picture either side at it's smallest size with just the content in the middle with a white margin either side.

Comment 17

[Loic]

Where are the gray margins on your screenshot? Can you circle them, please?
Sorry to be blind, but your bug is not really easy to understand, so please a screenshot quickly understandable.

Comment 18

[Mr Glyn Thomas [:mrglynthomas]]

Attachment: firefox-layout-normal.png

… when I cleared browser history the browser returned to normal and the smallest size looked like the attachment screenshot.

Comment 19

[Loic]

Attachment: win7ff45.png

I don't see that on Win 7 with FF45, on the screenshot, it's the smallest width I can obtain.

Comment 20

[Mr Glyn Thomas [:mrglynthomas]]

Hi Loic

If you compare both screen shots you'll see the bug, you won't be able to reproduce the bug as that looks like a Windows Firefox browser version on a Windows platform, this bug is for Mac OSX as reported 2016-02-23.

I will continue looking for this issue, after I have completed the launch of this latest web app project.

Thanks,
Glyn.

Comment 21

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

Are you using the DevTools responsive design tool during your work?  If so, is whether you used it or not related to whether the bug appears?

Comment 22

[Mr Glyn Thomas [:mrglynthomas]]

Thankyou Ryan for your help, I did reopen this bug, but somehow its been marked as resolved (not by me) ?

As discussed, With the google talk Firefox (for Mac) plugin installed, the bug (for me) can reproduced.

In this bug report I have included screen shots of the effect of the bug, and now can reproduce the bug, it could be that this bug is already known to Mozilla. 

I do use DevTools, but cannot say if this is related or not.
 
Once again thankyou Ryan for your help and I apologise for contacting you directly.


Thanks,
Glyn.

Comment 23

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

Okay, this sounds layout specific (not DevTools), let's have someone in this platform area triage this issue.

Comment 24

[Ciprian Muresan [:cmuresan], Formerly of Ecosystem QA - please needinfo @mcoman for things regarding the team]

Setting this to NEW based on comment 6.

Comment 25

[Mr Glyn Thomas [:mrglynthomas]]

Sorry for the delay … the details of how this rather low priority bug is caused -- and you can decide if it is even a bug! … and how it can be reproduced.

It is caused by firefox pop-up's warning message in the current or other tabbed windows, if the browser window has a pop up warning, then if you are for example checking a responsive website down to a small ( 355px / 360px ) type mobile screen size then you get this margin problem, but it is not that obvious if you have 20+ browser windows open, and the popup is delayed in one of these windows!

Does not seem to affect the firefox dev tools responsive screen size tester.

It can be easily reproduced.

Please close this report

thanks,

Glyn.