È possibile avvolgere il campo di immissione in uno span, che è position:relative;
. Quindi aggiungi con :before
content:"€"
il simbolo della tua valuta e fallo position:absolute
. Lavorare JSFiddle
HTML
<span class="input-symbol-euro">
<input type="text" />
</span>
CSS
.input-symbol-euro {
position: relative;
}
.input-symbol-euro input {
padding-left:18px;
}
.input-symbol-euro:before {
position: absolute;
top: 0;
content:"€";
left: 5px;
}
Aggiornamento Se si desidera inserire il simbolo dell'euro sia a sinistra oa destra della casella di testo. Lavorare JSFiddle
HTML
<span class="input-euro left">
<input type="text" />
</span>
<span class="input-euro right">
<input type="text" />
</span>
CSS
.input-euro {
position: relative;
}
.input-euro.left input {
padding-left:18px;
}
.input-euro.right input {
padding-right:18px;
text-align:end;
}
.input-euro:before {
position: absolute;
top: 0;
content:"€";
}
.input-euro.left:before {
left: 5px;
}
.input-euro.right:before {
right: 5px;
}
fonte
2015-02-05 06:55:29
Grazie mille! Questa è la soluzione che ha fatto il lavoro per me. Perfetto davvero! – User3419
Inoltre, è possibile includere il "$" all'interno di un tag
@Cohen Sebbene sia una buona idea avere più di un'etichetta [potrebbe causare problemi con l'accessibilità] (http://stackoverflow.com/a/ 3992160/1094772). – rybo111