The formatting for the credit card number and security code is off

3.  In the payment widget the formatting for the credit card number and security code is off.  It is confusing for people completing the form.  Can you tell me what causes this?  I have included a screenshot.

You can inject the following custom CSS Codes to fix the alignment:

input#input_14_cc_number {

    width: 95% !important;

}

label#sublabel_cc_number {

    width: 95% !important;

}

#creditCardTable > tbody > tr:nth-child(3) > td > span:nth-child(1) {

    width: 50% !important;

}

 

#creditCardTable > tbody > tr:nth-child(3) > td > span:nth-child(2) {

    width: 45% !important;

}

input#input_14_cc_ccv {

    width : 106% !important;

}

label#sublabel_cc_ccv {

    width : 100% !important;

}

 

select#input_14_cc_exp_month {

    width: 95% !important;

}

#sublabel_cc_exp_month {

    width: 100% !important;

}

select#input_14_cc_exp_year {

    width: 106% !important;

}

label#sublabel_cc_exp_year {

    width: 100% !important;

}

#creditCardTable > tbody > tr:nth-child(4) > td > span:nth-child(1)  {

    width: 50% !important;

}

#creditCardTable > tbody > tr:nth-child(4) > td > span:nth-child(2) {

    width: 45% !important;

}

 

Here's how to inject: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes. Please add the codes at the bottom.

Thanks