Is there any way to move the labels of my jotform's Stripe field above its inputs?

  • Profile Image
    kauseway
    Asked on November 30, 2014 at 02:18 PM
    2) The stripe widget has the labels below the fields.  But all my fields have the label above. Any way to change it in this module?
  • Profile Image
    jonathan
    Answered on November 30, 2014 at 05:34 PM

    Hi,

    You must be referring to the sub-labels of the Stripe payment tool in your jotform https://www.jotform.com/43320616980958

     

    but this are sub-labels, so they are usually located below the input field. Unlike the actual field label/name, which have an alignment properties that you can set.

     

    If you want to move the sub-labels of the Stripe tool at the top of the input field, it can be done using custom injected CSS code.

    Can please confirm first if that is what you wanted to do?

    Thanks.

     

     

     

  • Profile Image
    kauseway
    Answered on November 30, 2014 at 06:43 PM

    Yes I would like to do that. Thanks!

  • Profile Image
    val
    Answered on November 30, 2014 at 09:54 PM

    Hi,

    Thank you very much we will support any customers that needs out help.

    You can contact us anytime if you have any questions.

    Thank You!

  • Profile Image
    kauseway
    Answered on November 30, 2014 at 10:00 PM

    Sorry for the confusion. I do want to move the sub labels to the top of the fields in the credit card processing. I was told there needed to be a CSS injection to handle this. Can you help?

  • Profile Image
    val
    Answered on December 01, 2014 at 01:05 AM

    Hi,

    If I am correct, please check the screenshot below if this is what you want on your form (credit card processing). If that so, please inject the CSS files below to your form.

    #sublabel_cc_firstName,
    #sublabel_cc_lastName  {
    margin-top: -70px;
    margin-bottom:80px;
    }

    #input_19_cc_firstName,
    #input_19_cc_lastName  {
    margin-top: 30px;
    }

    #sublabel_cc_number {
    margin-top: -90px;
    margin-bottom:90px;
    }
    .form-textbox cc_number {
    margin-top: 50px;
    }
    .form-textbox cc_ccv{
    margin-top: 50px; }

    #sublabel_cc_ccv{
    margin-top: -70px;
    margin-bottom:80px;
    }
    #sublabel_cc_exp_year {
    margin-top: -60px;
    margin-bottom:80px;
    }
    #sublabel_cc_exp_month {
    margin-top: -80px;
    margin-bottom:80px;
    }

     

    Hope this help.

    Thanks.