Change the Braintree Payments CC fields font size

  • Profile Image
    Asked on June 08, 2016 at 09:38 AM

    When I try to increase font size on my payment form for a product (using Braintree payment integration), the only fields that increase in size are the First Name and Last Name.  The payment fields like credit card, expiration, etc. are stuck at their default size.  So the font size gets larger but the field size does not.  How do I get the payment fields to increase in size/height?

  • Profile Image
    Answered on June 08, 2016 at 10:57 AM

    Add this CSS codes between the <style> tag on the embedded form source code.

    .braintree-hosted-fields {

        font-size: 1em;

        display: block;

        height: 27px !important;

        width: 100% !important;

        box-shadow: 0 1px 2px #eee inset;


    This should give you the following result:

    Hope this helps!