How to apply css selector

HTML-CSS
#1

Tell us what’s happening:

what is the best possible syntax to apply a css selector to this code

Your code so far


<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  p {
    font-size: 16px;
    font-family: monospace;
  }
  h2 {
    font-size: 16px;
    font-family: lobster; monospace;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>
<main>
  <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>
  
  <div>
    <p>Things cats love:</p>
    <ul>
      <li>cat nip</li>
      <li>laser pointers</li>
      <li>lasagna</li>
    </ul>
    <p>Top 3 things cats hate:</p>
    <ol>
      <li>flea treatment</li>
      <li>thunder</li>
      <li>other cats</li>
    </ol>
  </div>
  
  <form action="/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>
  </form>
</main>
#2

The question is a bit vague, since there’s more than just one way to create and apply selectors.

Everything depends on your ultimate goal.
Maybe you can expand on that :slight_smile:

#3

how do i do this in the code?
Create a font-family CSS rule that uses the Lobster font, and ensure that it will be applied to your h2 element
Import the Lobster font.

Passed

Your h2 element should use the font Lobster .

Use an h2 CSS selector to change the font.

Passed

Your p element should still use the font monospace .

#4

Font family is called Lobster,

you are adding one called lobster

font-family: lobster; monospace;

Case sensitivity matters :slight_smile:

Also if you want to specify how a font downgrade, they should be separated by a , comma.

lobster; monospace; // not valid CSS

lobster, monospace; // valid CSS
#5

i used both upper and lower case for lobster

still got this error:
Use an h2 CSS selector to change the font.

#6

Have you fixed the semicolon as well? :slight_smile:

#7

yes i have actually, thanks for noting

#8

That’s just plain rude.
Remember that we are here volunteering our time trying to help people learn to code.

That said, if you are still having issue, and feels like you still need support,
can you please provide:

1- name of the challenge
2- full updated code
3 - OS, browser and other environment information that may be relevant

In the meantime you can clean the cache and try again, it may happens that challenges “hangs”, and sometimes a fresh reload is all it takes.

1 Like
#9

i think you got the wrong idea, i wasn’t being sarcastic, i was actually thanking you for pointing out the error for me. i appreciate. i’m sorry if my english is not that good.

1 Like
#10

No worries, English is not my first language as well, so I can understand the difficulties.
As well as the frustration that being stuck on a pice of code can lead to :smile:

Glad I could help.
Happy coding :+1:

1 Like
#11
.red-text { color: red; font-size: 16px; } p { font-family: monospace; } h2 { font-family: lobster; }
#12