Form fields cut off on mobile

  • buymorefans
    Asked on February 28, 2017 at 9:33 PM

    Hi,

     

     

    Form fields are cut off on mobile, especially the credit card exp month and year. Check it out at this link:

     

    https://mercadodefans.com/comprar-fans-facebook-pago#ANqrCQds

     

    https://www.jotform.com/build/70588338365972

     

     

     

    Let me know how to fix thanks,

     

  • Charlie
    Replied on March 1, 2017 at 4:01 AM

    Hi,

    See if this custom CSS code works for you:

    @media screen and (max-width: 480px) {

        #cid_13 > div > table > tbody > tr > td {

            width: 100% !important;

            display: block !important;

            padding-left: 0 !important;

        }

        

        table.form-address-table {

            max-width: inherit !important;

        }

        

        #input_13_cc_exp_month, #input_13_cc_exp_year {

            width : 90% !important;

        }

        

        #cid_13 > div > table > tbody > tr:nth-child(3) > td > span:nth-child(1) {

            width: 60% !important;

            

        }

        

        #input_13_cc_number, #input_13_cc_ccv  {

            width: 90% !important;

        }

        

        #cid_13 > div > table > tbody > tr:nth-child(3) > td > span:nth-child(2) {

            width: 38% !important;

        }

        

        #input_13_custom_1011_0 {

            width: 100% !important;

        }

    }

     

    Make sure to paste it at the top of your CSS area. 

    Let us know if that works.