Configurable List Widget: Can I display the fields in two rows?

  • Profile Image
    IRDA_DIRECTION
    Asked on February 26, 2018 at 02:49 PM

    Hello :)

    I need precision about the widget : Configurable List.

    I have too much requiered fields by row. Is it possible to show them on 2 lines because they appear out of the form...

    Thank you for you response !



    This is a re-post of a comment on Customize Your Form Using Custom CSS Codes

  • Profile Image
    Adrian
    Answered on February 26, 2018 at 04:12 PM

    It is possible to display each field in a separate row using Custom CSS.

    I have cloned your form and this is how the widget looks after making some changes.

    1519679300clw.png

    Cloned Form URL: https://form.jotform.com/80565745762971

    First, I have Injected this Custom CSS to the form so the form displays in the center:

    .form-all {

      margin-left: auto !important;

      margin-right: auto !important;

    }

    How to Inject Custom CSS Codes


    Then, I have Injected this Custom CSS to the Widget.
    How to Inject CSS Codes to Widgets

    * {

    color: #fff;

    }

    th {

    display: none;

    }

    td {

    display: table-row;

    }

    td:before {

    display: block;

    font-weight: bold;

    margin-top: 7px;

    margin-bottom: 2px;

    }

    .col1:before {

    content: "Organisme/adresse";

    }

    .col2:before {

    content: "Personne ressource";

    }

    .col3:before {

    content: "Téléphone";

    }

    .col4:before {

    content: "Courriel";

    }

    .col5:before {

    content: "Transfert d'argent";

    }

    .col6:before {

    content: "Consentement de promotion";

    }

    Let us know if you need further assistance.