::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
-
outline
and its longhands -
text-decoration
and its associated properties text-emphasis-color
text-shadow
Syntax
::grammar-error
Examples
Simple document grammar check
In this example, eventual supporting browsers should highlight any flagged grammatical errors with the styles shown.
HTML
<p>My friends is coming to the party tonight.</p>
CSS
::grammar-error { text-decoration: underline red; color: red; }
Result
Specifications
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
::grammar-error |
No |
No |
No |
No |
No |
No
See bug 175784.
|
No |
No |
No |
No |
No |
No |
See also
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/::grammar-error