Search code examples
htmlcssfontsfont-family

HTML font not properly working on my computer but works on other devices


Hi i am new to the HTML but i am having this issue where in my pc the font is not working or showing the right font-family but it works on IE or other computer any idea what seems to be the issue? I need to know the Accurate result of my style since i don't have an idea on what my webpage looked like until i presented it on my class

        <p style="font-size: 500%;
                    font-family: Fantasy;
                    color: white;">
            10 Important Computer Personalities<br>
            <span style="font-size: 50%;-webkit-text-stroke-width: 2px;">List by: Name</span>
        </p>

Here is the result on my Chrome or Microsoft Edge it is showing the Impact Font or what i atleast have expected the result

What i have expected or showing on my PC

And here is the result in other computers/devices or IE

What i get on other device


Solution

  • font-family: fantasy does not load a specific font, fantasy is a special keyword (the other four being serif, sans-serif, monospace, and cursive) that tells the browser to load "any font that is in the fantasy category". You are guaranteed that by using it, different computers may load different fonts. If you want to load a specific font, using a webfont is the only real way to ensure all browsers, on all systems, load the same font.