Solved

:nth-child() CSS3 Selector

Posted on 2014-09-23
4
38 Views
Last Modified: 2016-04-21
When trying to target a specific element to change its css in comparison with its like elements, I think 'why not use the :nth-child() selector?' However, sometimes it works for me and sometimes it does not. So I just have a couple questions:

What are the limitations of the :nth-child() selector?
What are good resources on learning about the :nth-child() selector?
0
Comment
Question by:Alyson Facha
4 Comments
 
LVL 58

Accepted Solution

by:
Gary earned 250 total points
ID: 40340374
There is no limitations - don't know what kind of limitations you think there would be.
But note it is nth-child - so the element you are targetting has to be a direct child.

http://www.w3schools.com/cssref/sel_nth-child.asp
0
 
LVL 53

Assisted Solution

by:COBOLdinosaur
COBOLdinosaur earned 250 total points
ID: 40340412
Generally when I want to target specific elements within a structure I prefer to use nth-of-type so that I can insert additional tags that modify or extend the structure without requiring a re-calculation of offset values.

nth-child is much less flexible than nth-of-type and I only use it when I need very narrow targeting.

Cd&
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question