FAQ: Learn CSS Selectors Visual Rules - CSS Setup Selectors - Class Name

This community-built FAQ covers the “Class Name” exercise in Codecademy’s lessons on CSS.

FAQs on the CSS exercise Class Name

Join the Discussion. We Want to Hear From You!

Have a new question or can answer someone else’s? Reply (reply) to an existing thread!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources about CSS in general? Go here!

Want to take the conversation in a totally different direction? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account, billing, Pro, or Pro Intensive? Reach out to our support team!

None of the above? Find out where to ask other questions here!

Other FAQs

The following are links to additional questions that our community has asked about this exercise:

  • This list will contain other frequently asked questions that aren’t quite as popular as the ones above.
  • Currently there have not been enough questions asked and answered about this exercise to populate this FAQ section.
  • This FAQ is built and maintained by you, the Codecademy community – help yourself and other learners like you by contributing!

Not seeing your question? It may still have been asked before – try searching for it by clicking the spyglass icon (search) in the top-right of this page. Still can’t find it? Ask it below by hitting the reply button below this post (reply).

What is the difference between id and class?
I tried using the following in the index page:

h1 id=“title”>Top Vacation Spots</h1

and then use the below in the css page:
#title {
color:teal;
}
I got the same result.
So, what is the difference between these and when to use one instead of the other?

1 Like

It’s all about hierarchy.

ID takes precedence over Class, and Class over Element.

ID>Class>Element.

If you wrote the following code in your CSS:


#title {
color:teal;
}

.classA {
color:maroon;
}

The former would overrule the latter and the text would be teal.

3 Likes

If there are, for instance, a number of p elements in the html page, how can I select specifically one of them in the css page to style only that one? Do I inevitably need to write the attribute of the element to do that?

Hello,

You would have to assign a unique id to this paragraph and then create a style for it in the CSS file.

2 Likes

Thanks, Virginia. I saw that the course explains this too.

If ID takes precedence over Class, then is they any real world use for Class attribute?. That’s to say why not just use ID in place of Class when selecting a specific element?

ID is used to target specific elements for styling and they are unique to the elements they have been assigned to (meaning a particular ID can’t be used more than once). Whereas Class can be used with multiple elements, this is used to style these elements at once.

So to answer your question regarding the usefulness of Class, it would be easier to set a Class to a group of elements for similar styling than to set a unique ID to each of these elements and have to style them one after the other.

Hope this helps

3 Likes

Why is the Syntax .ExampleClass ? Why was it decided, that the best way to recognize classes is to put a dot in front of them? Seems a bit confusing on first glance

Thank you so much this helped a lot!

1 Like

If I want to target the same elements like p for example, but with different class and I want to change their style all together, can I write the CSS code like the example?

HTML
p class=“brand”
p class=“story”
p class=“news”

CSS
.brand .story .news {
}

Thanks

What is a class exactly? Is it related to object-oriented programming?

Didnt wanna let me get through yet the code was identicle.

1 Like

I was literally about to post the same cropped screenshot :grin:

I looked for differences in the code in both html and css. Just a site bug I guess. I had to use the “replace with solution” button to get past the exercise.

No, I don’t believe CSS classes are like OOP classes.

Classes, in the context of CSS, are just a way to group HTML elements for styling in mass. Its a way to style many html elements at once.