How to recognise when it is appropriate to code CSS [closed]
I am working on a custom CSS file within a wordpress theme installation.
Within the CSS, there are times when I need to identify something like '.example', other times when it must be displayed as '#example' and other times when it is fine to keep it as 'example'.
Could someone please clarify the rules and how I can distinguish and decide for myself in the future which one to use in each instance?
This might have something to do with div ids and classes.
There is no 100% rule but generally:
id must be unique, therefore any styles applied to an ID are only usable for the one element on the page. Therefore it usually makes more sense to style by class rather than ID because the mjority of the time you are going to want to reuse your styles. Additionally using an ID makes it harder to override the style later because id's hijack specificity.
I even take this one step further in that nothing should EVER be styled by ID but rather always styled by class. The one exception i occasionally make is for page-level scoping based on the id of the
body tag. But even then a class is just as useful.
Id recommend reading up on OOCSS (note: i dont use any of the files used to illustrate the examples - im solely referencing the FAQ)