CODEWITHSUNDEEP
csscss-selectors
vlad
vlad

Reputation: 1611

CSS: select all starting from n-th element

How can I select all child elements starting from n-th element? For example I have a div with 7 spans and I need to select all spans starting with 3-rd element, so 4,5,6,7 should be selected.

Upvotes: 16

Views: 2866

Answers (3)

eevaa
eevaa

Reputation: 1457

You can use 

div:nth-child(n+3) {
    // your style here   
}

However, this does not specifically select elements 3-7. Instead, it excludes the first two elements. So it would also select elements 8,9, ...

Upvotes: 2

Robert Koritnik
Robert Koritnik

Reputation: 105019

CSS2.1 selector

span + span + span + span {
    /* matching a span that has at least 3 siblings before it */
}

CSS3 selector

span:nth-child(n+4) {
    /* matching from 4th span on */
}

Upvotes: 14

Robin Whittleton
Robin Whittleton

Reputation: 6339

div>span:nth-child(2)~span should do the trick. The ~ General Sibling Combinator selects all following elements. The spec is at http://www.w3.org/TR/css3-selectors/#general-sibling-combinators

Upvotes: 15

Related Questions