My two button classes are clashing and I don't know how to fix it

No, no formal teachers. Personal experience and the opinions of persons with whom I’ve spoken. (I’m older than I appear in my picture. meow.)

I do not use IDs promiscuously because they are “weighty”, “heavy-handed” compared to classes. To me, an ID carries too much specificity for comfort. A selector can only have one ID. An ID can only be used once on a page. One ID “outweighs” a trainload of classes. Requires heavier code to override styles assigned by an ID (such as the !important modifier).

I prefer to use IDs only where they are needed by JavaScript, by HTML as a fragment identifier, or by outside utilities (plugins) or server related code (whatever that might mean), and apply styles via classes. Yes, of course I make exceptions… but very few and not very often.

Classes can be combined and/or repeated. That’s powerful. Classes are more easily overridden/modified by other classes as needed. Bottom line, though, is that I like to keep it simple so I prefer to code with classes and add IDs where needed.

<opinion>
IDs are popular with new coders because the word “id” only contains 2 letters, whereas the word “class” requires one to break a sweat, waste time, and flirt with carpel-tunnel syndrome to type 5 letters. :eek: Something about the path of least resistance versus the logic of writing code seems to dominate inexperienced thinking. That’s what I believe, anyway. Am I wrong?
</opinion>

Did you know that an ID can appear only once on a page? (you overlooked that question :slight_smile: )

Why do you prefer to use IDs instead of classes?