CSS to align drop-down fields properly?

  • Profile Image
    JKulp42757
    Asked on June 01, 2016 at 05:14 PM

    My form is here: https://form.jotform.com/61468149726970

    I am trying to make the three dropdown fields of "type of business", "years in business" and "gross monthly sales", the same width as the other fields.

    I used  the code: .form-textbox, .form-dropdown {

        max-width : 95% !important;

        width : 95% !important;

    }

    I thought this code would work, but unfortunately it did not. It worked on the other fields, but not the dropdowns.

    I would also like to resize the Google Captcha, as on some pages I have the form, it overflows the form, I'd like to also put it at 95%.

    Thanks!

     

  • Profile Image
    Nik_C
    Answered on June 01, 2016 at 05:47 PM

    Please try to add this CSS to your Custom CSS field:

    #input_18 {

        width : 390px!important;

    }

    #input_19{

        width : 390px!important; 

    }

    #input_16{

        width : 390px!important; 

    }

    .form-dropdown {

    max-width: none !important;

    }

    That should maek all your fields line up and look like this:

    Hope it helps, let us know if you have further questions.

    Thank you!

  • Profile Image
    JKulp42757
    Answered on June 02, 2016 at 10:06 AM

    Great, thanks! 

     

    Is there a way to center it on the form, so all of the fields sit in the middle, instead of to the left as they are now?

  • Profile Image
    Huberson
    Answered on June 02, 2016 at 11:35 AM

    You can center the fields by simply increasing the horizontal padding from Designer.