Why are the fields for the date picker so small?

  • Profile Image
    PriestleyManagement
    Asked on August 16, 2016 at 11:29 AM

    I have added a date picker on our Architectural Request form. The fields are very small and when you enter the year, you cannot see the entire entry. How do I make the fields bigger?

     

    Thank you in advance for your assistance.

  • Profile Image
    Welvin
    Answered on August 16, 2016 at 12:50 PM

    It seems that you've tried changing some of the text box styles, but the date field has been affected causing the issue. 

    I've fixed it for you by adding the following custom CSS codes to your form:

    [data-type="control_datetime"] span[style*="white-space"] > .form-sub-label-container:first-child {

        display : none;

    }

    [data-type="control_datetime"] .form-input> span:nth-child(3) {

        width : 24%;

        margin-right : 0;

    }

    [data-type="control_datetime"] .form-input> span:nth-child(3) input {

        width : 100%;

    }

    [data-type="control_datetime"] .form-input> span:nth-child(4) {

        width : 6%;

    }

    [data-type="control_datetime"] .form-input span:nth-child(5) {

        padding-top : 10px;

    }

    [data-type="control_datetime"] .form-input .form-sub-label-container {

        width : 30%;

        margin-right : 0;

    }

    [data-type="control_datetime"] .form-input .form-sub-label-container input,

    [data-type="control_datetime"] .form-input .form-sub-label-container select {

        width : 80%;

    }

    [data-type="control_datetime"] .form-sub-label-container .date-separate {

        visibility: visible;

    }

    Here's how to check the codes: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

  • Profile Image
    PriestleyManagement
    Answered on August 16, 2016 at 04:47 PM

    Thank you so much for your assistance.