demo · v130

Bare declarations after nested rules

In pre-spec implementations, declarations placed after a nested rule moved to the top — surprising and often broken. In v130 they stay in source order. Toggle "background" to red below and watch where it lands.

CSS source

renders as

◆ .card with .icon

background swatch

resolved background:

the code

.card {
  color: black;
  background: white;       /* declared early */

  & .icon { color: blue; }

  background: gold;        /* bare decl AFTER nested rule */
}

/* v130 (spec): final background = gold (source order wins).
   Pre-spec:    final background = white (bare hoisted above nested). */

see also