Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Wo archive tread sia. Meɖekuku bia biabia yeye ne ehia kpeɖeŋu.

Why <input> and <textarea> have different fonts?

  • 4 ŋuɖoɖowo
  • 1 masɔmasɔ sia le esi
  • 7 views
  • Nuɖoɖo mlɔetɔ Jellby

Jellby
Jellby
more options

I'm using Firefox 32.0.3 under Kubuntu 14.04. This simple document shows the problem: 

<html>
<body>
<p>Test</p>
<p><code>Test</code></p>
<p><input value="Test"></input></p>
<p><textarea></textarea></p>
</body>
</html>

I have set "font.size.fixed.x-unicode" and "font.size.fixed.x-western" to "16", so that the "Test" in <code> shows at the same font size as the text. If I write something in the <textarea>, it shows at the same font size too. But the <input> has a smaller font size, and a different font, actually.

With the element inspector I can see that everything uses DejaVu fonts (I'm not sure why, I don't see where I have set this), but the <input> uses Ubuntu (which is the font set in the KDE preferences).

How can I make sure everything uses the same font and size?

I'm using Firefox 32.0.3 under Kubuntu 14.04. This simple document shows the problem: <pre><nowiki><html> <body> <p>Test</p> <p><code>Test</code></p> <p><input value="Test"></input></p> <p><textarea></textarea></p> </body> </html></nowiki></pre> I have set "font.size.fixed.x-unicode" and "font.size.fixed.x-western" to "16", so that the "Test" in &lt;code&gt; shows at the same font size as the text. If I write something in the &lt;textarea&gt;, it shows at the same font size too. But the &lt;input&gt; has a smaller font size, and a different font, actually. With the element inspector I can see that everything uses DejaVu fonts (I'm not sure why, I don't see where I have set this), but the &lt;input&gt; uses Ubuntu (which is the font set in the KDE preferences). How can I make sure everything uses the same font and size?

cor-el trɔe

All Replies (4)

guigs
guigs
more options

Hi Jellby, Unfortunately there is a wiki mark up in the forums that prevents some html from rendering properly in a post. I would be happy to troubleshoot if you have a url/thimble or jsfiddle example we can collaborate on.

I also recommend either opening a webcompat.com bug with an example or a stackoverflow.com question for a faster response.

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Code uses font-family: -moz-fixed; 

resource://gre-resources/html.css

Input uses font-family: -moz-use-system-font; font-size: medium; 

resource://gre-resources/forms.css

Textarea uses font-family: -moz-fixed; font-size: medium; 

resource://gre-resources/forms.css
Jellby
Jellby Biabia la
more options

@guigs2 I didn't intend the code to be rendered in the forum, but if you want a live version, maybe this works: http://jsfiddle.net/k87pLhjw/

Jellby trɔe

Jellby
Jellby Biabia la
more options

@cor-el Is that the intended behaviour? I can see the point both in using the system font and the fixed font, but I don't see why input and textarea should have different choices. Could we count this as a bug? In that case, should I report it?