Fixed Search box misaligned in Firefox 41.0.1

Arty

Well-known member
As of Firefox 41 search box in header is misaligned:
box1.webp
box2.webp

Notice spacing on right side of input.
It doesn't happen in Chrome or other WebKit based browsers because of this rule in xenforo.css
Code:
input[type=search] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
}
Firefox uses border-box for input, so it looks different than in Chrome.

To fix it unprefix box-sizing rule in code above in xenforo.css:
Code:
input[type=search]
{
    -webkit-appearance: textfield;
    box-sizing: content-box;
}

This is what search box looks like in Firefox after fix:
box3.webp
box4.webp
 
It appears that this has been added to the Firefox core styles:
Code:
input[type="search"] {
  box-sizing: border-box;
}
I'm a little unclear on why specifically as it makes it function differently from other text inputs. Regardless, I have overridden this now. Thanks for the report.
 
Back
Top Bottom