-
gyangtingAsked on August 23, 2014 at 5:04 PM
Hi,
I need to add small icons at the beginning of fields, as here: http://screencast.com/t/0XsLNhrC
Can you help me achieve that?
Thanks,
Guy
-
gyangtingReplied on August 23, 2014 at 5:07 PM
Also, my customers are on mobile primarily, so I need icons to work on mobile.
Thanks,
Guy -
Welvin Support Team LeadReplied on August 24, 2014 at 12:46 AM
Hi Guy,
You can inject a custom CSS codes to your form to do that. For the Credit Card Number input:
.form-textbox.cc_number {
background-image: url('http://www.jotform.com/icon/cc.png');
background-repeat: no-repeat;
padding-left: 20px;
}
Change http://www.jotform.com/icon/cc.png to your actual credit card icon.
The same codes for the CVV input:
.form-textbox.cc_ccv {
background-image: url('http://www.jotform.com/icon/cc.png');
background-repeat: no-repeat;
padding-left: 20px;
}
Still, change the URL of the icon.
Here's a guide on how to inject a custom CSS to the form: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
Thank you!
-
gyangtingReplied on August 24, 2014 at 4:42 AM
Thanks Welvin. This put me on the right track to get what I wanted!
I just had to add background-position: 7px 7px to position the icon where I wanted.
Perfect now!
Great support!
Guy