What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Is it possible to alter look of the credit card fields?

    Asked by prowrestlingtees on June 10, 2016 at 04:37 PM

    How can remove the - and / from the credit card fields?

    Move credit card and security code next to each other?

    It's currently using the mobile responsive widget

    Page URL:
    https://form.jotform.com/61584709959171

  • Profile Image

    Answered by Ben on June 10, 2016 at 05:24 PM

    To do that you should add the following CSS to your form:

    .form-sub-label-container {
        color: transparent;
    }
    @media screen and (max-width:480px) {
     #creditCardTable tr:nth-child(3) td span {
        width: 50%;
     }
    }

    This first one will hide the - and / from the table and the second one will put the fields together into the same row on mobile devices.

    You can add it to your form by following the steps here: Inject Custom CSS Codes

  • Profile Image

    Answered by prowrestlingtees on June 10, 2016 at 05:27 PM

    That worked. The only thing is the security code sub text is still at the bottom

  • Profile Image

    Answered by prowrestlingtees on June 10, 2016 at 05:28 PM

    Same with expiration month and year. They are not aligned

  • Profile Image

    Answered by Ben on June 10, 2016 at 05:45 PM

    The CSS above did not modify the expiration month and year, and it seems OK to me.

    Could you grab a screenshot of the error so that we can see what you mean?

    All that I could see not aligned properly was the Credit Card number field, for which if you add the following CSS:

    #sublabel_cc_number {
        margin-top: -1em;
    }

    It should look properly for you (add it next to the previously added CSS).

    Do let us know how it goes.