adding icons at beginning of credit card fields (using stripe)

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

Also, my customers are on mobile primarily, so I need icons to work on mobile.

Thanks,
Guy

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!

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