I have an application which displays the data in a field in 2 languages like this:
ENG: This is the english text
FR: Ici est le …..
I want to make this dynamic based on the user’s language selection in the Browser or the user’s locale setting on his system.
First I changed the data to be like this:
<span id="EN">This is the english text</span>
<span id="FR">Ici est le …..</span>
and define a CSS file like this:
#EN
{
font-size: 30px;
color: red;
}
#FR
{
font-size: 10px;
color: blue;
}
All Ok so far :D
But what I really want is to detect the language and display either the French or the English text but not both.
So I can presumbly hide the French or English by setting it to 0px but how do I do this dynamically and will it work on all Browsers consistently.
I have played around with :lang(en) but not too sure this is the way to do it.
Thanks