Letter spacing CSS important directive detected
| Field | Value |
|---|---|
| Rule code | Text_LetterSpacing_Important_Detect |
| WCAG conformance level | AA |
| WCAG success criterion | 1.4.12 Text Spacing |
| Must be fixed at source | Yes |
Description
Letter spacing with the CSS !important directive was detected. The use of the CSS important directive prevents users from applying their own styles to text and prevents tools from providing assistive style enhancements. We do not recommend applying the CSS important directive to styles related to text letter-spacing as it prevents the facilitation of user-based enhancements that may assist with the readability of the text presentation. An exception to this recommendation is if the letter-spacing provided is already at least 0.12 times the utilized font-size.
How to fix
If the letter-spacing is not at least 0.12 times the utilized font-size, remove the '!important' directive from text-based letter-spacing styles and ensure proper CSS inheritance is utilized instead. You can be more specific about CSS selector targetting such as: 'body main .spaced { letter-spacing: 0.11rem; }' instead of forced, important styles like '.spaced { letter-spacing: 0.11rem !important; }'.