CSS class and id with the same name

CssClass

Css Problem Overview


Is there anything wrong with having a css class and id with the same name? Like .footer for the article/post's footer and #footer for the page footer.

Css Solutions


Solution 1 - Css

Nope, perfectly acceptable.

A class is defined using a . and an ID is defined using a #. So as far as the browser is concerned, they're two totally separate items.

The only thing to be careful of is generating any confusion for yourself. It's probably best practise to keep the names different purely for code readability, but there's no harm in them being the same.

Solution 2 - Css

No, there is nothing wrong, but it might be better to use different names to not confuse other developers. It is more (human) error prone to use different names.

Solution 3 - Css

Yes, you can use same name for both id and class because both parameters have their own significance.

Solution 4 - Css

The only problem with having same name for class and id is code readability and maintainability. They can have the same names, the browser will render the correct CSS as classes and ids are marked differently (. for class and # for id), but an upgrade or bug fix can be a problem for the developer.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSpencerView Question on Stackoverflow
Solution 1 - Cssdjdd87View Answer on Stackoverflow
Solution 2 - CssThariamaView Answer on Stackoverflow
Solution 3 - CssAnuj SharmaView Answer on Stackoverflow
Solution 4 - CssSuspectBloom993View Answer on Stackoverflow