Issue #15 - Spell check

You can disable spell check in input, textarea and contenteditable fields.

<label for="msg">Message</label>
<textarea spellcheck="false" id="msg">HTML is amazzing!</textarea>

spellcheck is an enumerated attribute, so we must provide a value, either “true” or “false”. If no attribute is present, the browser decides whether it checks an element for spelling errors.

<div>
  <label for="msg">Message</label>
  <input value="HTML is amazzing!" id="msg">
</div>

<div>
  <label for="msg2">Message</label>
  <textarea id="msg2">HTML is amazzing!</textarea>
</div>

<div>
  <strong>Message:</strong>
  <div contenteditable>HTML is amazzing!</div>
</div>

If you click one of the fields below (in some browsers you have to type something), you should see a squiggly, dashed or dotted red line indicating that “amazzing” isn’t spelled correctly. Please note: Results may differ depending on your browser and default language. The attribute is merely a hint, browsers are not required to check for spelling errors.

We can hint browsers at (not) checking an element for spelling errors.

<div>
  <label for="msg2">Message</label>
  <textarea spellcheck="false" id="msg2">HTML is amazzing!</textarea>
</div>

In the following textarea you shouldn't see a squiggly red line because spellcheck is set to “false”.

In the following input field you should see a squiggly red line because spellcheck is set to true.

Resources

• caniuse
• HTML spec