HTML/CSS - Input [Text] How to disable the browser from offering suggestings in the Dropdown?

HtmlCssInput

Html Problem Overview


I'm building an autosuggest search, like apple's spotlight... and want to disable the browser from offering text suggestions under the input box. I can't remember if that's an html or css setting and can't find it.

Anyone remember?

Html Solutions


Solution 1 - Html

The attribute:

<form autocomplete="off">

is, I think, what you're looking for.

Solution 2 - Html

html attribute:

autocomplete="off"

Solution 3 - Html

To disable auto-completion of input fields, use the HTML attribute autocomplete with a value set to off.

<... autocomplete="off" .../>

Solution 4 - Html

This doesn't work in modern browsers. Use:

<div contenteditable="true"></div>

If you need pleaceholder add css:

[contenteditable="true"][placeholder]:after {
    content: attr(placeholder);
    color: #abb4cd;
}
[contenteditable="true"][placeholder]:not(:empty):after {
    display: none;
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAnApprenticeView Question on Stackoverflow
Solution 1 - HtmlDavid ThomasView Answer on Stackoverflow
Solution 2 - HtmlNaeem SarfrazView Answer on Stackoverflow
Solution 3 - HtmlTrenton BostView Answer on Stackoverflow
Solution 4 - HtmlDragon3578951View Answer on Stackoverflow