how can I increase size of drop down box (using css code) ?

  • Nmead
    Asked on April 21, 2016 at 2:24 AM

    table.form-spinner....... works fine for spinner elements

    what is the equivalent name for a dropbox (and how would I find that??

  • beril JotForm UI Developer
    Replied on April 21, 2016 at 4:02 AM

    Do you want to change the width of your dropbox field or the height of your field?

    You can change it from designer quickly.

    how can I increase size of drop down box (using css code) ? Image 1 Screenshot 30

    If you want to change it with CSS code you can change it easily. To do that click on CSS when you're on Designer and double-click to the desired field and add the CSS code below: 

    how can I increase size of drop down box (using css code) ? Image 2 Screenshot 41

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.

     

     

  • Nmead
    Replied on April 21, 2016 at 6:43 AM
    I was hoping to change the blue rectangle containing the values. Is this possible or can I only change the yellow shaded area surrounding this
    ...
  • beril JotForm UI Developer
    Replied on April 21, 2016 at 7:36 AM

    Yes, You can increase de size of your dropbox field. I just wanted to show you how to change it. If you delete  the code below, because it is preventing to increase the height of dropdown field.

    how can I increase size of drop down box (using css code) ? Image 1 Screenshot 40

    If you want to change the size of the dropdown field for all of your dropdown fields, please add the CSS code below:

    .form-dropdown {

        height : 90px !important;

         width : 60px!important;

    }

    Here is how it works:

    how can I increase size of drop down box (using css code) ? Image 2 Screenshot 51

    However if you want to change the size of your fields for 2.1H and 2.1A fields, you need to add the CSS code below:

    #input_95 {

        width : 60px !important;

        height : 90px !important;

    }

     

    #input_94 {

    width : 60px !important;

    height : 90px !important;

    }

    Here is how it works:

    how can I increase size of drop down box (using css code) ? Image 3 Screenshot 62

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.