Learn Typography by Building a Nutrition Label - Step 4

Tell us what’s happening:

Error message states one link element should have href attribute ./styles.css. however I have href=“style.css” in my second link element. I could be wrong but I think this needs to be updated.

Your code so far

<!-- file: index.html -->

<!-- User Editable Region -->

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Nutrition Label</title>
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800"></link>
  <link rel="stylesheet" href="style.css"></link>
</head>

<body>
  <h1>Nutrition Facts</h1>
  <p>8 servings per container</p>
  <p>Serving size 2/3 cup (55g)</p>
</body>
</html>

<!-- User Editable Region -->

/* file: styles.css */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.3 Safari/605.1.15

Challenge Information:

Learn Typography by Building a Nutrition Label - Step 4

Hello there!
Kindly check your hint box, you have the correct value printed there.

You need ./styles.css , instead of styles.css and remove closing link tag. That’s unnecessary and not required.
@RussellPhoenix

Okay. Would you kindly explain the difference between href=“./style.css” and href=“style.css” as I have used href=“style.css” before and it worked but it may have been for something different.
Also can you please explain why no closing tag for link is required?

Thank you

There is no special difference between styles.css and ./styles.css, actually. Both are used interchangeably here on fCC. It’s not something you need to worry about. Just make sure you put in exactly what they ask on the tutorial. Generally, periods, slashes and other symbols for hrefs indicate file paths, but that’s a complicated thing you don’t need now. You could take a look at this if you’re interested:

As for <link>, some html tags just simply don’t need a closing tag. These are called “self closing tags”. <img> is another example. You wil encounter these all the time, and you just have to try to remember which ones are and which ones aren’t. Don’t worry, it’s not that hard and you will soon know them by heart without even trying if you keep coding.
Hth,
Nicolas, 17.

1 Like