Warning Duplicate property in the same rule

Why declaring the same property twice in one rule is usually a leftover mistake, and how the cascade resolves it.

The validator warns when the same property is declared more than once inside a single rule block.

Example

.button {
  color: blue;
  padding: 0.5rem;
  color: red; /* wins — the earlier "blue" never applies */
}

Why it matters

Within a single rule, when the same property appears more than once, the last declaration wins and every earlier one is simply discarded — this is part of the CSS cascade's normal, well-defined behavior, not an error. In practice, though, an accidental duplicate almost always means an edit left a stale declaration behind, and the "winning" value isn't the one that was intended. There is one legitimate, deliberate use of this pattern: a fallback value for browsers that don't support a newer syntax, followed by the modern value — for example a plain color fallback before a color-mix() value.

Frequently asked questions

Is duplicating a property ever intentional?

Yes — the common case is a fallback: declare a widely-supported value first, then the modern value second. Browsers that don't understand the second declaration ignore it and keep the fallback; browsers that do understand it use the later, winning value.

Which declaration wins if a property is duplicated?

Within the same rule and the same specificity, the one that appears later in the source order wins — every earlier declaration of that property in the same block is discarded.