CSS Nesting

CSS Tutorial Series (94/109). Prefer one article? Read the complete CSS tutorial.

Short description

Native CSS nesting is widely available in modern browsers — keep nesting shallow.

Nesting

.card {
  padding: 1rem;
  & h2 { margin-top: 0; }
  &:hover { border-color: #0f766e; }
}