css-selectors

This is one of the most well-known examples of authors misunderstanding how :first-child works. Introduced in CSS2, the :first-child pseudo-class represents the very first child of its parent. That’s it. There’s a very common misconception that it picks up whichever child element is the first to match the conditions specified by the rest of the … Read more

.classA.classB refers to an element that has both classes A and B (class=”classA classB”); whereas .classA .classB refers to an element with class=”classB” descended from an element with class=”classA”. Edit: Spec for reference: Attribute Selectors (See section 5.8.3 Class Selectors)

You can check directly at the CSS grammar. Basically1, a name must begin with an underscore (_), a hyphen (-), or a letter(a–z), followed by any number of hyphens, underscores, letters, or numbers. There is a catch: if the first character is a hyphen, the second character must2 be a letter or underscore, and the … Read more

This is a very common problem that arises due to a misunderstanding of how :nth-child(An+B) and :nth-of-type() work. In Selectors Level 3, the :nth-child() pseudo-class counts elements among all of their siblings under the same parent. It does not count only the siblings that match the rest of the selector. Similarly, the :nth-of-type() pseudo-class counts … Read more

Is there a CSS parent selector?

Selectors match elements based on information within the document tree. The device has nothing to do with selector matching whatsoever. So it doesn’t make sense to be able to write device-specific selectors. You were probably looking for media queries — that’s the module that deals with device-specific CSS.