Rudie Rudie - 1 year ago 175
CSS Question

CSS select all child elements except first two and last two

I'm very curious (that's all) to see how you would select all children of an element except the first two and last two.

I've a method, but it's nasty and unreadable. There must be a much clearer method that doesn't need 8 pseudo-selectors.

:not(:nth-child(1)):not(:nth-child(2)):not(:nth-last-child(1)):not(:nth-last-child(2)) {
background: purple;

Yeah, that's pretty horrible. It literally selects all elements that are :not the first or second first or last. There must be a method that uses
as a semi-variable, instead of piling on pseudo-selectors.

I thought of another one (still messy):

:not(:nth-child(-1n+2)):not(:nth-last-child(-1n+2)) {
background: purple;

Answer Source

You don't even need :not(). :nth-child(n+3):nth-last-child(n+3) works fine.

Check it out here.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download