How to hide the payment field title with CSS

  • unruhfurniture
    Asked on March 26, 2018 at 9:16 AM

    I have two questions that I outlined in the attached screenshot. Thanks for the help!


    Here's the current CSS:


    .form-label.form-label-auto {

        display : block;

        float : none;

        text-align : left;

        width : 100%;

    }


    .form-required {

        color : #ffffff;

    }


    .form-line-error .form-error-message {

        background-color : #1D3648;

    }


    .form-line-error .form-error-message .form-error-arrow {

        border-bottom-color : #1D3648;

    }


    .form-line-error {

        background-color : #ffffff;

    }


    body, .form-all {

        background : none !important;

    }


    .form-all {

        margin-left : 100 !important;

    }


    .jotform-form {

        padding : 0!important;

    }


    .form-line-error .form-error-message {

        background-color : none;

    }


    .form-line-error .form-error-message .form-error-arrow {

        border-bottom-color : #ffffff;

    }


    .form-line-error {

        background-color : #ffffff;

    }


    .supernova .form-all {

        border : 0 !important;

        box-shadow : none !important;

        -moz-box-shadow : none !important;

        -webkit-box-shadow : none !important;

    }


    .form-line.form-line-active {

        background-color : #ffffff;

    }


    .form-buttons-wrapper {


    }


    .form-pagebreak {

        border-top : none;

    }


    .form-pagebreak {

        border-top : none;

        background : none;

    }


    #form-pagebreak-back_16 {

        display : none;

    }


    input#input_18_1000,  input#input_18_1000 + label {

        display : none;

    }


    .form-submit-button:hover {

        background : #E5C181 !important;

    }


    .form-submit-button:active {

        -moz-box-shadow : 0 0px #000 inset;

        -webkit-box-shadow : 0 0px #000 inset;

        box-shadow : 0 0px #000 inset;

    }


    .form-textarea {


    }


    .form-label.form-label-top {


    }


    .form-line {


    }


    Jotform Thread 1425775 Screenshot
  • Adrian
    Replied on March 26, 2018 at 11:16 AM

    1. To copy the entered data from the Full Name field to the Credit Card Name field, please add the following condition:

    How to hide the payment field title with CSS Image 10

    2. To hide the Payment Field title an reduce the margins, please add the following CSS to your form:

    #cid_18 .form-product-item,
    #cid_18 hr,
    #cid_18 > div > div {
      display: none !important;
    }

    table.payment-form-table th {
      display: none !important;
    }

    I have cloned your form and made those changes to the cloned form.
    https://form.jotform.com/80844151697969

  • unruhfurniture
    Replied on March 26, 2018 at 5:43 PM
    Thanks so much!
    *Sam Unruh*
    Owner, Unruh Furniture
    cell: 816.808.5259
    ...