Why fontSize? Why would font-size not work?

Question

While I was changing heading font size on DevTool, I noticed that I couldn't use

heading.style.font-size = '2em';

but instead I had to use

heading.style.fontSize = '2em';

Why is that?

You want to put in quotes. `heading.style.fontSize = "2em";`. — deEr., Apr 04 '18 at 08:40
because `font-size` could be parsed as `font - size` - meaning it's taking a variable called `font`, and one called `size` - it doesn't work for js — treyBake, Apr 04 '18 at 08:40

score 8 · Accepted Answer · edited Apr 04 '18 at 09:55

8

Dashes cannot be used in dot notation because property names are identifiers. The - is a keyword for things such as subtraction.

You can however do the following.

document.querySelector("div").style["font-size"] = "7em";

<div>Test</div>

edited Apr 04 '18 at 09:55

DTavaszi

answered Apr 04 '18 at 08:40

Quentin

1 Answers1