ID and Class attribute

Hi, hope everyone is doing well.

I have been wondering if ID overrides the class attribute so why there is a need for class why don’t we just use ID.

Thank you,

Welcome to the freecodecamp forum, abdulsamikhan20022!

Classes are used for styling multiple elements at once. So you could style both <p>
and <form> elements (for example) at the same time with a class name.

On the other hand IDs are used for styling a specific element.

1 Like

hello @abdulsamikhan20022.a :wave: :wave:

One of the reasons to use classes as well as Id is

The same ID can be used only for a single element
whereas
you can use the same class for multiple-elements,
this is because of a reason and the reason is explained well in this post

https://www.instagram.com/p/CMoT4LVjOEt/

2 Likes

Hi! @abdulsamikhan20022.a

Id can only be used for single/one element whereas a class can be used for multiple elements.

See this:

2 Likes

I remember struggling to understand this when I first started as well.

They don’t override each other and are totally separate.

IDs are unique and classes can be used as often as you like.

Quick example. You would generally only have one main logo on your site so that would have an id of ‘logo’.

You have a nav bar made up of anchor links. You want all these styled the same but different from the links on the rest of the page. You would use classes here and give your nav links a class of something like ‘nav-link’. You can then use .nav-link as a CSS selector.

3 Likes