Diagnostics
LUM3020: Unknown CSS property
A declaration's property is not a CSS property, so browsers ignore the declaration.
Severity: warning · Category: styles (3xxx)
Reported by: the CSS compiler (lumiose_css), in @lumiose/vite, lumiose check and the language server. A warning; the CSS is emitted unchanged.
#What it means
Lightning CSS keeps a declaration with an unknown property name as it is, and browsers skip it, so
a typo such as colr: red silently does nothing. A property is known when it is in MDN's list of
CSS properties (standard, experimental, non-standard and obsolete ones) or Lightning CSS knows it.
When a known property is one or two edits away, the help names it and the fix replaces it.
Not checked: custom properties (--brand), vendor-prefixed properties (-webkit-line-clamp,
-moz-…), at-rule descriptors (@font-face, @page, @property) and names that are not plain
identifiers.
#Example
<style>
.card {
colr: navy;
backgrund-color: white;
}
</style>#How to fix it
Correct the name (color, background-color): the fix does it for close matches. For a value
you read with var(), name it as a custom property (--card-color). If the property is real but
newer than Lumiose's list, the warning is safe to ignore; report it so the list can be updated.