Avatar for Username

Eheka Pytyvõha

Emboyke pytyvõha apovai. Ndorojeruremo’ãi ehenói térã eñe’ẽmondóvo pumbyrýpe ha emoherakuãvo marandu nemba’etéva. Emombe’u tembiapo imarãkuaáva ko “Marandu iñañáva” rupive.

Kuaave

Ko téma oñeñongatúma. Ejapo porandu pyahu eikotevẽramo pytyvõ.

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

  • 4 Mbohovái
  • 1 oguereko ko apañuái
  • 7 Hecha
  • Mbohovái ipaháva 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?

Moambuepyre cor-el rupive

Opaite Mbohovái (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 Porandu apoha
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/

Moambuepyre Jellby rupive

Jellby
Jellby Porandu apoha
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?