How can I get the formatting of different date-fields look all the same?

  • Profile Image
    benjaming
    Asked on August 10, 2018 at 04:42 PM

    On the printscreen, you will see that the same field (a date field) is showed in 3 different ways. I would like all date field look the same, and more specifically like the first one: in 3 columns, and aligned with th rest of the form.


    Thank you for your help.

  • Profile Image
    BDAVID
    Answered on August 10, 2018 at 05:51 PM

    You are customizing your form through CSS injection, which is why you see different sizes for the Date fields. So, you need to apply the same code for that Date field. You need to add the following code(highlighted in yellow), to the following portions of your code:

    #cid_42 span, #cid_43 span, #cid_53 span {

        width : 31% !important;

    }

    #cid_42 span:first-child, #cid_43 span:first-child, #cid_53 span:first-child {

        float: left !important;

        margin: 0px !important;

    }

    #cid_42 span:nth-child(2), #cid_43 span:nth-child(2), #cid_53 span:nth-child(2) {

        margin: 0px 3.5% !important;

    }

    #cid_42 span:last-child, #cid_43 span:last-child, #cid_53 span:last-child {

        float: right !important;

        margin: 0px !important;

    }

    Also, disable the shrink option from that Date field:

    1533937809off.png

    Here is my clone form, where the change is reflected: https://form.jotform.com/82216590347963 

  • Profile Image
    benjaming
    Answered on August 11, 2018 at 07:35 AM

    Great job! Thank you for your prompt and perfect reply.