CSS to align drop-down fields properly?

  • JKulp42757
    Asked on June 1, 2016 at 5: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!

     

  • Nik_C
    Replied on June 1, 2016 at 5: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:

    CSS to align drop down fields properly? Image 1 Screenshot 20

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

    Thank you!

  • JKulp42757
    Replied on June 2, 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?

  • Huberson
    Replied on June 2, 2016 at 11:35 AM

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

    CSS to align drop down fields properly? Image 1 Screenshot 20