HTML text input field with currency symbol

Question

I would like to have a text input field containing the "$" sign in the very beginning, and no matter what editing occurs to the field, for the sign to be persistent.

I would be good if only numbers were accepted for input, but that's just a fancy addition.

Answer 1

Consider simulating an input field with a fixed prefix or suffix using a span with a border around a borderless input field. Here's a basic kickoff example:

.currencyinput {
    border: 1px inset #ccc;
}
.currencyinput input {
    border: 0;
}

<span class="currencyinput">$<input type="text" name="currency"></span>