I design .

I'm Ketan ‐ A Melbourne web designer, developer and illustrator with 20 years industry experience.

A quick note about styling the first element, but only if there's more than one of them

9 May 2021 CSS

The paragraph you are reading right now is styled differently from the rest of the paragraphs down below. This only applies if there are more sibling paragraphs below.

I could do this using javascript or some cool stuff dynamically in my code, but it’s actually straightforward in CSS:

p.first-child:not(:last-child) {
  /* Add styles here */
}

These few lines of CSS target the first child paragraph, not the last (child) paragraph. So, if there’s only one paragraph, the styles won’t apply because it is also the last paragraph.