Search code examples
htmlcsssassmultilingual

css - Two fonts in one page for two languages


I'll explain myself. I want my users to be able to write (in inputs, etc.) in two languages, Hebrew and English. The website itself can be in English entirely but the user could still type in Hebrew and vice versa. So basically, I have no way of knowing in what language the user will type in my input box, but I want a matching font for each one of my languages (so the input box looks pretty both in English and in Hebrew).

So, how can I have 2 fonts for 2 languages in 1 element?

BTW: The answer is not :lang(he). It doesn't automatically detect language, just the HTML attribute lang. It's the same as writing [lang=he]


Solution

  • As far as I know, this should happen automatically. Just assign both fonts like this: font-family: 'Arial', 'Arial (Hebrew)'; You could look at this example.