Combo fields formatting questions

  • Profile Image
    Anista_01
    Asked on February 23, 2017 at 08:00 PM

    Hi Guys,

    I'm hoping you can show me where/how I can address piints A,B,C see attached image.

    A. Input text only displays the top half of the text

    B. How can I change the name field to display first and last name next to each other horizontally

    C. How can i increase the space at the start of the name input field. eg between the "D" and the edge of the field?

     

    Cheers

    Dujon 

  • Profile Image
    jonathan
    Answered on February 24, 2017 at 12:00 AM

    Allow me some time to work on your form https://form.jotform.co/70461452367860 style issue.. It needs custom CSS codes to fix the issue.

    I'll be back shortly.

  • Profile Image
    jonathan
    Answered on February 24, 2017 at 12:15 AM

    Please refer to my test form https://www.jotform.com/70540075138956

    #A

    I could not reproduce the same issue. Perhaps you have fixed it already?

    Let us know if still happening on your form

    --

    #B #C

    Add the CSS codes below to your form.

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

        width: 47%;

    }

    #input_185,#input_185_confirm {

        padding-left : 10px !important;

    }

     

    The fixed form look like this.

     

    Let us know if you're not able to make it work.

  • Profile Image
    Anista_01
    Answered on February 24, 2017 at 02:46 AM
    Thanks Jonathan.
    Will this code carry through the other text fields too ? If not, how can
    make this global?
    Ta
    Dujon
    ...
  • Profile Image
    Charlie
    Answered on February 24, 2017 at 05:38 AM

    You can try this one:

    [data-type="control_fullname"] span {

        width: 48% !important;;

      margin-right: 1% !important;;

    }

    input[type="text"], input[type ="email"], textarea {

        padding-left : 10px !important;

    }

     

    This should cover all the full name field and all input boxes. You can paste it under the CSS tab in the Form Designer tool:

     

    Let us know if that works. 

  • Profile Image
    Charlie
    Answered on February 24, 2017 at 05:39 AM

    Sorry for that, I made an update to the CSS code, you can directly view the updated one on this link: https://www.jotform.com/answers/1074871

  • Profile Image
    Anista_01
    Answered on February 26, 2017 at 02:46 PM
    Perfect, perfect, perfect.... thank you Charlie :)
    Ta
    Dujon
    ...
  • Profile Image
    Anista_01
    Answered on March 09, 2017 at 09:17 AM
    Hi Guys,
    I thought I forward the below email to illustrate that empty fields are
    still being shown, even though I have selected them not to be shown.
    https://form.jotform.co/70588957349880
    [image: Inline images 1]
    Ta
    Dujon
    ---------- Forwarded message ----------
    ...
  • Profile Image
    Kiran
    Answered on March 09, 2017 at 01:57 PM

    Unfortunately, the images attached to the email reply cannot be posted back on the forum thread. We request you to upload the screenshots to the forum thread using the URL below:

    https://www.jotform.com/answers/1074871

    We will wait for your response. Thank you!