Credit Card input fields size too small WooPayments

  • I would like to change the credit card input files height. I use WooPayments.
    Apparently till now I have achieved my goal using the following code in Additional CSS but unfortunately the following code doesn’t work on the website’s live version. 

    Field-numberInput {

    padding-right: 34.8px;
height: 30px !important;

    } Field-expiryInput {

    height: 30px !important;

    } Field-cvcInput {

    height: 30px !important;

    }

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Support Reynier C. (woo-hc)

    (@reynierc)

    Hi @tomenr ,

    Thanks for reaching out! Your CSS snippet might need a slight adjustment. CSS classes usually start with a period. So, try updating your code like this:

    .field-numberInput {
    padding-right: 34.8px;
    height: 30px !important;
    }

    .field-expiryInput {
    height: 30px !important;
    }

    .field-cvcInput {
    height: 30px !important;
    }

    Make sure these classes exactly match the ones used by WooPayments. If they still don’t work, it’s possible there are other styles overriding them. In that case, inspecting the element with browser’s developer tools might reveal the correct classes to target.

    Please note that CSS/Code customization are outside our scope of support, but since it’s a simple concern, I went ahead and pointed it out. Just in case you need advanced customization, based on the feedback we get from our customers we highly recommend contacting one of the services on our Customization page.

    Hope this helps!

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.