0

I downloaded the Google Font Poiret One and want to use it with Bootstrap. However, that's not been working out well so far. It looks like Comic Sans.

<link rel="stylesheet" href="fonts/PoiretOneregular.ttf">

This is what I'm using to refer to the font. Name of the file is correct. 

font-family: 'Poiret One', cursive;

This is the CSS portion.

What am I doing wrong?

sindhugauri
  • 189
  • 2
  • 14
  • that's not the way the fonts work with CSS ... https://css-tricks.com/snippets/css/using-font-face/ – DaniP Sep 09 '16 at 14:25

2 Answers2

1

You are attemping to link to a .ttf font file with a stylesheet link, which to my knowledge isn't possible. You could always try using the CDN instead

<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">

If you want to use the font that you've downloaded locally, take a look at: How do I load external fonts into an HTML document?

Community
  • 1
  • 1
Jack Evans
  • 1,697
  • 3
  • 17
  • 33
1

You are trying to link to your actual font file (the .ttf file) as a style sheet.

The src attribute of your link should be to a CSS file not a font file.

For instance this is the link tag if you link to the font family directly from google:

<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">

The CSS file will contain references to your actual font files, so if after changing your src you still have issues, open the CSS file and make sure the paths to the font files are correct and relative to the CSS file.

Robert Wade
  • 4,918
  • 1
  • 16
  • 35