CSS Specificity

  • When two selectors try to apply the same style to an element, the more specific one wins
  • Inline styles are the most specific because they are directly tied to an element
  • IDs are next because they should only apply to one element
  • Classes are next because they indicate a specific category of elements
  • Tag selectors are next because they apply to all elements with a tag
  • Count the number of each category above in a selector
  • Sort according to the number of the most specific category and then break ties with the next

5 / 14