HTML Password Field Mask

Posted on 2011-02-18
Last Modified: 2012-05-11
Hello Experts,

My graphic designer did something extraordinary that no one  can figure out. If you go to you will see that when you type something in the Password field, it is blank as opposed to bullets or stars.

He claims that the value property is interfering, but I doubt this. I believe this is a CSS-thing.

Any ideas?
Question by:APD_Toronto
  • 2
  • 2
  • 2
  • +1

Accepted Solution

AriMc earned 125 total points
ID: 34930071
When I type text into the password fields I get bullets with both Firefox 3.6.13 and IE 6.


Author Comment

ID: 34930093
I use IE8
LVL 21

Assisted Solution

by:Dale Burrell
Dale Burrell earned 250 total points
ID: 34930120
I'm getting bullets with chrome... sounds like an IE8 specific hack.
What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.


Assisted Solution

onemadeye earned 125 total points
ID: 34930125
From my side it shows bullet too on IE8 ... so I'm not sure where the problem is
LVL 21

Assisted Solution

by:Dale Burrell
Dale Burrell earned 250 total points
ID: 34930130
It should be fairly easy to do though, use a javascript event to catch each keypress, store it in a hidden field, and clear the password field.

Why you would want to do it is another matter though? Personally I like to see that I am entering data.

Expert Comment

ID: 34930145
Your graphic designer may be using some CSS frameworks like Blueprint that tries to level the differences between browsers and accidentally change the behaviour with IE 8. I'd pressure the designer to resolve the issue. I also think it is a CSS thing. Unfortunately I don't have IE 8 installed to check it out with that.


Author Closing Comment

ID: 34957410
sorry for tthe delay.  Thank you

this is an IE8 issue, changing the font-family for the password field does the trick.

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at Browse or search based on font properties or name to find a suitable font for…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now