Unable to import Lobster font

Tell us what’s happening:
I cannot pass this portion of the tests. The site doesn’t think the Lobster font has been imported (it has been). I have used the provided example with the old link to Google Fonts as well as used both the link and @import options within Google itself. None of it allows for me to pass this part of course.

  **Your code so far**

@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');

h2 {
  font-family: Lobster, GENERIC_NAME;
.red-text {
  color: red;

p {
  font-size: 16px;
  font-family: monospace;

<h2 class="red-text">CatPhotoApp</h2>
<p class="red-text">Click here to view more <a href="#">cat photos</a>.</p>

<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

  <p>Things cats love:</p>
    <li>cat nip</li>
    <li>laser pointers</li>
  <p>Top 3 things cats hate:</p>
    <li>flea treatment</li>
    <li>other cats</li>

<form action="https://freecatphotoapp.com/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br>
  <label><input type="checkbox" name="personality" checked> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label><br>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
  **Your browser information:**

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:89.0) Gecko/20100101 Firefox/89.0

Challenge: Import a Google Font

Link to the challenge:

Hi @hyperionterror !

Welcome to the forum!

The FCC tests have been designed to look for specific things.
I would use the link they provided you in the lesson and place it above the style tags.

I just tested your code with that link and it passes for me.

Also, you don’t need to add this in your font-family

The directions say that part is optional.
FCC instructions:
The GENERIC_NAME is optional, and is a fallback font in case the other specified font is not available. This is covered in the next challenge.

So I would get rid of it.

Hope that helps!

This challenge does not support @import notation. You need to copy the link code from the challenge.

You also have not assigned the font-family to h2 elements correctly. There is no font named “GENERIC_NAME”.

Thanks! This worked for me.

Thank you as well. I removed the “GENERIC_NAME” property value. I must have missed the optional part of the instructions.
The @import notation was my latest attempt at getting the font to import. The other two options weren’t working for me either, but placing the link element above the style element did the trick.

I’m glad I could help. Happy coding!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.