::grammar-error
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The ::grammar-error CSS pseudo-element represents a text segment which the user agent has flagged as grammatically incorrect.
Allowable properties
Only a small subset of CSS properties can be used in a rule with ::grammar-error in its selector:
- color
- background-color
- cursor
- caret-color
- outlineand its longhands
- text-decorationand its associated properties
- text-emphasis-color
- text-shadow
Syntax
css
::grammar-error {
  /* ... */
}
Examples
Simple document grammar check
In this example, eventual supporting browsers should highlight any flagged grammatical errors with the styles shown.
HTML
html
<p>My friends is coming to the party tonight.</p>
CSS
css
::grammar-error {
  text-decoration: underline red;
  color: red;
}
Result
Specifications
| Specification | 
|---|
| CSS Pseudo-Elements Module Level 4 # selectordef-grammar-error | 
Browser compatibility
BCD tables only load in the browser