Can I shorten the fields for entering credit card data?

  • stevenkessler
    Asked on March 27, 2016 at 6:24 PM

      For my one and only form  -- 

    How can I get the Credit Card Number field and the Security Code number field on one line?  Also, how can I get the credit card expiration date and the expiration year on one line?

  • Ashwin JotForm Support
    Replied on March 27, 2016 at 9:37 PM

    Hello stevenkessler,

    I am currently working to find a a solution of your problem but it is talking time. I will get back to you on this later today. 

    Thank you!

  • stevenkessler
    Replied on April 14, 2016 at 2:12 AM

    Did anyone ever succeed in shortening these fields to make the credit card section look cleaner and more professional?

     

    thanks,

    Steven

  • beril JotForm UI Developer
    Replied on April 14, 2016 at 3:51 AM

    Hello Steven'

    First of all, we are deeply sorry for the late response. Içe checked your form which is http://www.jotform.us/form/60877419690165 I am able to reproduce the same issue that you're having.

    Can I shorten the fields for entering credit card data? Image 1 Screenshot 30

     

    To solve that issue, you can add the CSS code below:

    .form-textbox.cc_number {

        width : 170px !important;

    }

    .form-sub-label-container {

        width : 170px !important;

    }

    #cid_15 span.form-sub-label-container {

        width : 170px !important;

        margin-left : 15px !important;

    }

    At that time, it will work as expected. Here is how it works on my side:

    Can I shorten the fields for entering credit card data? Image 2 Screenshot 41

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.