Dropdown: How can I make it so the box size and font is like all of the other fields?

  • Profile Image
    MasortiOlami
    Asked on July 14, 2020 at 12:38 AM

    Hi,

    I"m using the address field for my form (here: https://form.jotform.com/201621949160048), but for the country drop-down field, i'm noticing that it's doesn't take on the same formatting as my other fields. I've managed to add CSS so that the background of the field box is the same gray, but how can i make it so the box size and font is like all of the other fields?

    Thanks,

    Tehila



    This is a re-post of a comment on How to Inject Custom CSS Codes

  • Profile Image
    Ariel_P
    Answered on July 14, 2020 at 05:09 AM

    Hello,

    Thank you for reaching out.

    You can use the following snippet to adjust the Select field's appearance. -How to Inject Custom CSS Codes.

    select {
        padding-top: 2px !important;
        padding-bottom: 2px !important;
        padding-left: 4px !important;
        padding-right: 3px !important;
        max-width: 288px !important;
        font-size: .9em !important;
        color: #000 !important;;
    }

    Fine tune the element style to your liking by changing property's the value.

    Note that the code above will change the appearance, most, if not all of your Select fields(dropdown).

    If you only need to change the Country field, use the following code instead.

    #input_4_country {
        padding-top: 2px !important;
        padding-bottom: 2px !important;
        padding-left: 4px !important;
        padding-right: 3px !important;
        max-width: 288px !important;
        font-size: .9em !important;
        color: #000 !important;;
    }

    Once applied, it should look something like so.

    15947175962020-07-14 17_05_56.jpg

    Please give it a whirl and let us know if this fits your requirements.

  • Profile Image
    MasortiOlami
    Answered on July 15, 2020 at 10:38 AM

    Thank you so much! this worked perfectly!