Password fields are fixed width on mobile

The .element-invisible is the culprit here. It's getting clipped and a height of 1px pixel is being added to it. However there is no width added which is causing an overflowing container. Adding 1px width fixes the problem here.

.element-invisible {
    clip: rect(1px,1px,1px,1px);
    position: absolute!important;
    overflow: hidden;
    height: 1px;
    width: 1px;
}

I'll add a patch as soon as I have access to the development site.

See #2045151: width:1px in visually-hidden class causing problems for screen readers in Firefox for a potential problem with width: 1px;

This is also affecting issue pages, in links like report spam<span class="element-invisible"> on user skippednote</span>

Looks like the solution from #2045151: width:1px in visually-hidden class causing problems for screen readers in Firefox is to add both:

  width: 1px;
  word-wrap: normal;

to .element-invisible

This was deployed a few days ago, there are now less white margins on the right side of the page on mobile.