I need separated underscores

Question

I would like to display a number of underscores to the user to let them know how many characters they need to fill in to satisfy the length requirement.

My problem is: underscores aren't separated by spaces.

Q: What font or css style should I use so that my underscores can be easily counted?

Answer 1

You can just use letter-spacing: 0.4em; to separate out the various characters in the element. I'm assuming you're using an input element, so:

input {
    letter-spacing: 0.4em; /* or whatever measurement you prefer... */
}

JS Fiddle demo.

References:

• letter-spacing at the MDC.

Answer 2

Use the CSS property letter-spacing.

Visual example: http://jsfiddle.net/8w9WY/