0

I'm trying to apply two downloaded fonts in my CSS for an HTML site. For some reason, even thought I use @font-face, it still doesn't work. Any idea of how to solve this?

Here's the code:

 @font-face {
    font-family: "BigNoodleTitling"; 
    src: url(fonts/Big Noodle Titling/big_noodle_titling.ttf) format("truetype");

    font-family: "RomanSD";
    src: url(fonts/Roman/Roman SD.ttf) format("truetype"); 
}

#Encabezado {
    border: 3px solid black;
    background-color:  #f3cb7b;

}
#Encabezado h1 { 
    text-align: center;
    font-size: 18px;
    font-family: "BigNoodleTitling";
}

#Encabezado h2 {
    text-align: center;
    font-size: 26px;
    font-family: "RomanSD";
Ian Naiquen Quiñones
  • 1
  • 2
  • @Simon — Why? `'` and `"` are interchangeable in CSS, and optional inside `url()`. – Quentin May 12 '17 at 12:22
  • "it still doesn't work" — That's rather vague. What have you done to debug it? When you use the developer tools in your browser and inspect the element, does it show the rule as applying to it? When you look at the Network tab, do you see the request for the font file? Does it get a 200 OK response? When you use [a validator](https://jigsaw.w3.org/css-validator/) does it tell you that there are no errors? – Quentin May 12 '17 at 12:25
  • Make sure you're giving a valid src – Abhishek Pandey May 12 '17 at 12:25

0 Answers0