Artboard 16light, inspiration, solution, idea, innovation,Google Sheets iconSwift icon
Published at
Updated at
Reading time
1min

I read the new web.dev course on Forms today and learned a surprising fact about forms in Microsoft Edge.

Did you know that Edge provides a "password reveal" button in password fields? That's right; password fields include a little clickable "eye icon" to show and hide the entered password.

A password field in MS Edge including a "reveal password" button.

However, a great usability feature only available in one browser isn't great. ๐Ÿคทโ€โ™‚๏ธ If you want to provide password reveal functionality to all browsers, you still have to implement it yourself. And that means you have to get rid of Edge's little gimmick.

To hide Edge's additional password functionality, use this cryptic pseudo-element. ๐Ÿ‘‡

::-ms-reveal {
  display: none
}

If you're using Edge, play with the pseudo-element below.

Playground
Preview

And if you want to learn more about this functionaliy, check the Microsoft Edge Reference docs.

Related Topics

Related Articles