1
HTML/CSSAdvanced#css#layout-puzzle
IDs must be unique per page and carry much higher specificity (0,1,0,0) than classes (0,0,1,0), making later overrides harder and reducing reusability. Classes are reusable across multiple elements and keep specificity low and predictable, which is why most style guides reserve IDs for JS hooks/anchors only.
/* Avoid */
#submit-button { background: blue; }
/* Prefer */
.btn-primary { background: blue; }
<button id="submit-button" class="btn-primary">Submit</button>