Search from End and Empty Blocks

Sometimes we need to count elements not from the beginning, but from the end of the list, or hide blocks that have no content.

1. :nth-last-child(n)

Works exactly like :nth-child, but starts counting from the last element.

• Example: Select the second-to-last element: :nth-last-child(2).
• Why: Style elements depending on how many are left until the end of the list.

2. :empty

Selects elements that contain absolutely nothing inside (neither text, nor other tags, not even spaces).

/* Hide empty notifications so they don't take up space */
.notification:empty {
  display: none;
}