Have set font-family on body but textarea wont apply it

Question

On my css file, I've set the following:

body {
  font-family: Roboto, sans-serif;
}

And as expected, it has applied to the entire html except for a "textarea" box which for some reason has applied what seems to be the consolas font.

My current fix for this is to select the specified element and set the same line of code posted above.

textarea {
  font-family: Roboto, sans-serif;
}

Any suggestions?

The user agent stylesheet contains default formattings for many elements, among them probably a monospace font-family for textarea. Instead of specifying it explicitly, you can use `textarea { font-family: inherit; }` - then it will use whatever font-family the parent element uses. — CBroe, May 16 '22 at 14:19
I think [this](https://stackoverflow.com/questions/2874813/why-textarea-and-textfield-not-taking-font-family-and-font-size-from-body) answers your question — Cédric, May 16 '22 at 14:19

score 0 · Answer 1 · answered May 16 '22 at 14:19

As you've discovered, the default value for font-family for textarea elements is not inherit.

It is for most elements, but since textareas often care about whitespace, browser stylesheets for them default to a monospace font.

If you want to change it, then you need to do so with a rule that targets the textarea — as you've done.

This is normal.

1 Answers1