- Templates
-
Integrations
- INTEGRATIONS
- See 100+ integrations
-
- FEATURED INTEGRATIONS
-
PayPal
-
Slack
-
Google Sheets
-
Mailchimp
-
Zoom
-
Dropbox
-
Adobe Sign
-
Google Calendar
-
Hubspot
- See more
- Products
How would I insert the '$' on a "number" element?
-
brfiAsked on June 16, 2021 at 05:58 AMHow would I insert the '$' on a "number" element?
Using https://www.jotform.com/a, input ID #input_171 as an example.
-
PatrickAnswered on June 16, 2021 at 06:11 AMJotform SupportHello! Custom CSS can be used for this purpose. I noticed that you partially implemented the solution yourself. I've prepared the remaining code. Here is the test form: https://form.jotform.com/211662704303951?jumpToPage=5
If this solves your purpose, then you can use the following CSS code in your form:
div#cid_171::before {
content: "$";
position: absolute;
bottom: 23px;
left: 10px;
}
input#input_171{
padding-left: 15px;
}
In case you come across any questions, let us know.
Thank you!
-
brfiAnswered on June 16, 2021 at 12:27 PM
Thank you!
I understand that adding the "$" sign to the stripe payment field is not possible, since that is a numbers only field and it will not accept non-numbers. However, using CSS, can it make it seem like the "$" sign is there, even if it's not actually in that field?
I want to change this:
to this:
(I will remove the "USD" by following your instructions HERE.)
-
PatrickAnswered on June 16, 2021 at 02:12 PMJotform Support
Hello! Yes, this is possible. You can use the following CSS code to implement this:
div#cid_194::before{
content: "$";
position: absolute;
top: 10px;
left: 5px;
z-index: 1;
}
input#input_194_donation{
padding-left: 15px;
}
Here is an example form: https://form.jotform.com/211665116729963?jumpToPage=5
Let us know if you have any further queries.
Thank you!
-
brfiAnswered on June 16, 2021 at 02:45 PM
That was spectacular, thank you!!
One more question, how would I rearrange the stripe element?
I want to change this:
So that it would look like this:
-
GirishAnswered on June 16, 2021 at 11:45 PMJotform SupportHello,
I am not sure if that is possible even using CSS.
But will check and revert.
-
brfiAnswered on June 17, 2021 at 02:02 AM
Thank you. If that is not possible, would I at least be able to move the sublabel to thetopand make it the same size as a regular label?Never mind, that's a regular option, right on the form.
-
PatrickAnswered on June 17, 2021 at 02:26 AMJotform Support
Hello! It seems you were able to resolve this at your end. But if you need further assistance with this, let us know.
Thank you!
