CODEWITHSUNDEEP
htmlcss
Onyx
Onyx

Reputation: 5762

Why is the rendered font on my website Arial when I have set font-family: 'Helvetica', 'Helvetica Neue', 'Arial', sans-serif;

As you can see the in image below, the font-family property of my element is Helvetica, sans-serif, however, the rendered font is Arial. Why is this happening? Now I'm not too sure which font is being actually rendered.

enter image description here

Upvotes: 0

Views: 2209

Answers (1)

Scott Marcus
Scott Marcus

Reputation: 65808

Because your system doesn't actually have Helvetica, so you get the next choice on the list.

Setting the font-family doesn't give the user those fonts, it's a suggestion to the client as to which font to use and then suggestions on which to use if the first choice isn't available.

Windows computers aren't likely to have Helvetica on them, but they will have Arial. Conversely, Macs will have Helvetica, but not Arial. This is why the generic family of sans-serif exists. It tells the system to use whatever the system default sans-serif font is, which on your system is Arial.

Upvotes: 3

Related Questions