Why is nth-child selector not working?

by

The nth-child selector counts siblings (i.e., elements having the same parent).

In your HTML structure, div.social-logo is always the first, last and only child of a. So nth-child has only one element to count.

However, there are multiple anchor elements, all of which are siblings (children of #social-links), so nth-child can target each one.

#social-links a:nth-child(1) div 
#social-links a:nth-child(2) div 
#social-links a:nth-child(3) div 
              .
              .
              .

More Related Contents:

  1. CSS negation pseudo-class :not() for parent/ancestor elements
  2. How can I select the last element with a specific class, not last child inside of parent?
  3. How can I style even and odd elements?
  4. Several elements with the same ID responding to one CSS ID selector
  5. Matching the first/nth element of a certain type in the entire document
  6. Using CSS :before and :after pseudo-elements with inline CSS?
  7. Difference in applying CSS to html, body, and the universal selector *?
  8. How can I correctly select the first or the last child with CSS?
  9. Using :before and :after CSS selector to insert HTML [duplicate]
  10. What is syntax for selector in CSS for next element?
  11. :nth-child(even/odd) selector with class [duplicate]
  12. How to CSS: select element based on inner HTML [duplicate]
  13. What is the performance impact of the universal selector?
  14. What are the priorities among CSS selectors
  15. CSS select elements with partial id
  16. Can a dynamic class be styled using CSS? [duplicate]
  17. Default :target with CSS
  18. Can a ::before selector be used with a ?
  19. Avoiding repeated constants in CSS
  20. Select second last element with css
  21. How do I give a CSS class priority over an id?
  22. How to run the CSS3 animation to the end if the selector is not matching anymore?
  23. Why does the general-sibling combinator allow toggling pseudo-element’s content, but not the adjacent-sibling?
  24. Is there a css selector for selecting an element futherup in the html?
  25. How to get CSS to select ID that begins with a string (not in Javascript)?
  26. Selecting the last element among various nested containers
  27. Is there a reason to use a instead of a:link or a:visited in my stylesheet?
  28. Zebra striping a flexbox table with wrapping items
  29. How to select classes with spaces
  30. CSS nth-match doesn’t work

Leave a Comment