Is it possible to use CSS to disable autocomplete on a form element (specifically a textfield)?
I use a tag library which does not permit the autocomplete element and I would like to disable autocomplete without using Javascript.
Use the <input> tag with autocomplete attribute. Set the autocomplete attribute to value “off”.
Sept 2020: autocomplete="chrome-off" disables Chrome autofill. Original answer, 2015: For new Chrome versions you can just put autocomplete="new-password" in your password field and that's it. I've checked it, works fine.
This can be done in a <form> for a complete form or for specific <input> elements: Add autocomplete="off" onto the <form> element to disable autocomplete for the entire form.
As it stands, there is no 'autocomplete off' attribute in CSS. However, html has an easy code for this:
<input type="text" id="foo" value="bar" autocomplete="off" />
If you're looking for a site-wide effector, an easy one would be to simply have a js function to run through all 'input' s and add this tag, or look for the corresponding css class / id.
The autocomplete attribute works fine in Chrome and Firefox (!), but see also Is there a W3C valid way to disable autocomplete in a HTML form?
You can use a generated id
and name
everytime, which is different, so the browser cannot remember this text-field and will fail to suggest some values.
This is at least the cross browser safe alternative, but I would recommend to go with the answer from RobertsonM (autocomplete="off"
).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With