Cloud Cloud Cloud Cloud

The password Type

The Current State of HTML5 Forms

Let Wufoo do the hard work. Sign up for a free account and start making forms the easy way.

Live Demo





Firefox

Safari

Safari

Chrome

Opera

IE

Android

The Low Down

The password input type is used to create an obscured text control.

  • Other than dirname and list, the password input type accepts the same attributes as the text input type: you can basically use password for any input control where you want to obscure the content the user enters.
  • Attributes supported in theory by the password input type include autocompleteinputmodemaxlengthminlengthpatternplaceholderreadonlyrequired, and sizeInputmode and minlengthare not yet supported in any browser. Autocomplete should be set to off: autocomplete="off".
  • When a dynamic keypad is used for data entry, many browsers will temporarily display each character as it is entered for better user experience (it’s easy to typo when a key is so tiny).
  • To make any non-GUI input type appear obfuscated in Safari, Opera and Chrome you can include -webkit-text-security with the value of disc, circle, square, or none. This will not alter the appearance of the password input type, however, because of the inclusion of
input[type="password"] { -webkit-text-security: disc !important;}

in the User Agent stylesheet. While you can overwrite CSS in your UA StyleSheet, you can’t overwrite any !important found there. Example

  • What obfuscated, the password input type is not actually secure. The value is passed unobfuscated and not encrypted, so always, at minimum, use method="post" over SSL.
Cloud Cloud Cloud Cloud

Let Wufoo do the hard work.

Sign up for a free account and start making forms the easy way.