How to vertically align the arrow on the drop-down field?

  • Profile Image
    klausdyba
    Asked on February 19, 2017 at 05:46 AM

    Hello! I always have problem with the arrow position when I want to choose the advanced (better looking) dropdown design.

     

    Somehow I cant reach the arrow by css.. Any idea how to middle the position of the arrow?

     

     

    Thank you

  • Profile Image
    Mike_G
    Answered on February 19, 2017 at 09:36 AM

    Please try to add the CSS codes below to your form:

    div#cid_55.form-input-wide.jf-required::after, div#cid_75.form-input-wide.jf-required::after {

        top: 17px !important;

    }

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    I hope this helps. If you have any further questions, please feel free to contact us again anytime.

    Thank you.

  • Profile Image
    klausdyba
    Answered on February 19, 2017 at 10:31 AM

    That worked!! Great!! However, one drop down looks still strange. Also got problems to target it in css...

     

    (the left in the attachement...

     

  • Profile Image
    Mike_G
    Answered on February 19, 2017 at 11:57 AM

    You're most welcome. I'm glad that I was able to help.

    With regards to your new concern, please use the codes below to fix it.

    div#cid_57.form-input-wide.jf-required::before {

        border-radius: 4px !important;

        border-left: none !important;

    }

    Thank you.