C#•3w ago

Local version looks different to online

So I'm new to all of this and finally have it working. Before I actually start my project, I'm just making sure I have it functioning etc, but I have a small but annoying problem. Basically, my local version and online server version look different using the same browser. I inspected it online and css is the same (font) but it's different for some reason. Any suggestions? Thank you.

5 Replies

mtreit•3w ago

Is it a non-standard font that perhaps isn't necessarily available?

QuostixOP•3w ago

The two fonts I tried were 'Source Code Pro' and 'Tahoma'. I've just tried Arial and they match now. Weird. I guess it was the fonts. Thank you!

mtreit•3w ago

If you need to you can add fonts to your website, something like this:

<style>
@font-face {
  font-family: 'Cascadia Mono';
  src: url('/assets/fonts/CascadiaMono.ttf') format('truetype');
}

@font-face {
  font-family: 'Cascadia Code';
  src: url('/assets/fonts/Cascadia.ttf') format('truetype');
}

@font-face {
  font-family: 'FiraCode-Regular';
  src: url('/assets/fonts/FiraCode-Regular.ttf') format('truetype');
}
</style>

<style>
@font-face {
  font-family: 'Cascadia Mono';
  src: url('/assets/fonts/CascadiaMono.ttf') format('truetype');
}

@font-face {
  font-family: 'Cascadia Code';
  src: url('/assets/fonts/Cascadia.ttf') format('truetype');
}

@font-face {
  font-family: 'FiraCode-Regular';
  src: url('/assets/fonts/FiraCode-Regular.ttf') format('truetype');
}
</style>

QuostixOP•3w ago

Great, I'll give that a try, thank you for the help, appreciate it

mtreit•3w ago

Sure thing

Gaming

Programming

Local version looks different to online