Forum Moderators: open

Message Too Old, No Replies

Firefox changed font in text inputs

         

Solution1

6:22 am on Aug 14, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I noticed that since Firefox 39 or 40, text inputs on some of my sites are displayed with a different font. In the CSS, they used to have the font inherited from the body, and I can correct it by setting a font for text inputs explicitly.

The changed font does not look good on my sites, as it seems to be one of those modern fonts, while I have content text in Trebuchet or Georgia.

I didn't find anything about this in the Firefox release notes. I tried turning off some add-ons, but that didn't make any difference. I tried changing the default font in the Options, and that didn't make any difference either. (I only checked on my own desktop computer, so it could be specific to it.)

Anyone else noticed this?
Anyone any idea what happened?

engine

3:10 pm on Aug 14, 2015 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



I hadn't noticed anything like that, but, if it's too subtle I may have missed it anyway.

Is it possible it's related to your own machine? Check it on another machine and see how it looks?

Solution1

6:51 pm on Aug 14, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I'm having difficulty checking someone else's machine, at the moment.
Anyway, rebooting my own computer doesn't make any difference.

This piece of HTML should show the problem.
On my PC, the letter 'g' is clearly different in the text input and the <p>, while they should be the same, if in both the font is Trebuchet. In the text input, the 'g' resembles a number '9', in the <p>, it has this almost oval lower part, as it is in the Trebuchet font.
<!DOCTYPE html>
<html>
<head>
<title>Text input font test</title>
<style>
body {
font-family: "Trebuchet MS";
font-size: 15px;
}
</style>
</head>
<body>
<form>
<input type="text" value="ggg">
</form>
<p>ggg</p>
</body>
</html>

Solution1

1:02 pm on Aug 15, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I checked on someone else's computer. It's there too.

not2easy

1:47 pm on Aug 15, 2015 (gmt 0)

WebmasterWorld Administrator 10+ Year Member Top Contributors Of The Month



Try a small edit to the css:
<style>
body, input {
font-family: "Trebuchet MS";
font-size: 15px;
}
</style>

Solution1

3:54 pm on Aug 15, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



Sure, it's not that much of a problem to correct the CSS. But does that get done everywhere where it's needed? On my sites it is, in this case at least, but elsewhere?

I'm not much of a fan of changing defaults. Defaults need to be predictable, and changing them never is.

It's a good case for using Normalize.

Solution1

2:28 pm on Sep 2, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



Looks like the last Firefox update changed this font to Tahoma.
That looks better to me, but it still doesn't feel right.

tangor

3:23 pm on Sep 2, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Curious! Then again I'm NOT the fellow to ask as I over ride all website font suggestions in my FF and use a font most machines do not have installed "Cooper Md BT" across all sizes and display (page, text area, pre, etc)

Only remarking that while the OP's query above is something to be considered, also be aware that there are many on the web who over ride webmaster fonts (or browser fonts, too!) because of visual needs, or exasperation at some of the choices/layouts some use. That "many" is certainly a small number, but they/we do exist.