How to get back to a one column?

  • Profile Image
    EffieMcNair
    Asked on January 19, 2016 at 08:02 AM

    Hi there!

    I was working on 3 - columns form and now would like to go back to one but I am not able to as the form builder keep on squashing my fields into the left column. I need to be able to add wider fields now and love to get rid of the columns after the header "Extras" (please see link attached - roll all the way down, just before the "Submit" button, you can see my squashed fields....)

     

    Many thanks

    Effie

  • Profile Image
    EltonCris
    Answered on January 19, 2016 at 11:19 AM

    Hello Effie,

    To expand back the fields, just right click it then click on Expand on the form builder.

    Example:

    However, with your form, you have currently set a max limit width of the fields to 40px on the form designer. This is the reason why they still appear too small on the form builder. This option will be shown when you load the form on the Designer then click on one of the text area fields.

    Example:

    Simply increase the value from 40px to your preference. This should expand the fields back. However, take note that this would affect the shrunken fields too.

    If you need further assistance, do let us know.

    Thanks!

  • Profile Image
    EffieMcNair
    Answered on January 19, 2016 at 11:16 PM

    Thanks for your reply, however - what would be the solution if I want to work with mixed field?

    I still have many other field to add that the are bigger than 40px.  Is it possible to work with one size only ? What if the form has 200 fields with 40px and another 200 fields with 150px? how do I go about creating them all?

    Thanks,

    Effie

  • Profile Image
    Chriistian
    Answered on January 20, 2016 at 04:28 AM

    Hi,

     

    If you wish to have several fields with different sizes, you will have to target them using css.

    Here's an example:

    .form-number-input.form-textbox {

        width: 70px!important;

    }

    This css targets the input fields with the class .form-number-input.form-textbox and changes their width to 70px.

     

    Do inform us if you need further assistance,
    Regards.

     

  • Profile Image
    EffieMcNair
    Answered on January 20, 2016 at 05:53 AM

    Thanks for that! I've already worked it out in the meantime :-) however good to hear that I am on the right track.

    I've another question but I will open new thread for that - thanks for your help.

  • Profile Image
    Charlie
    Answered on January 20, 2016 at 09:55 AM

    In behalf of my colleagues, you are most welcome :)

    Feel free to open a new thread here in the forum anytime for your other concerns.

    Cheers!