set maxlength in a textfield according to the size of the text

Question

how to set the maxlength in a textfield according to the size of the text?How to set the textfield size irrelated to the character?

When setting max length say for example my textfield size is 10. But when i type all 1's in the text field, text field is filled till its half. But when I try to set a UpperCase A, i.e. 10 A's then the textfield is filled and even overflows for that 10 chars.

How to set the textfield size irrelated to the character?

Answer 1

You should choose a monospaced font.

E.g.

<input type="text" size="10" maxlength="10" style="font-family: monospace;">

(note: above is just an example; the normal practice is to define CSS in its own .css file and use class attribute to refer it)

Result:

The font-family: monospace will choose the browser's default monospaced font. But there are more, such as Lucida Console, Courier New, etc.