This forum is no longer open and is for reading/searching only.

Please use our new MachForm Community Forum instead.

MachForm Community Forums » MachForm 3

How can i set the width of each text field and the whole form?


  1. jasons
    Member

    hi
    id like to be able to individually set the width of each text field on the form.
    i would also like to be able to set the width of the whole form.

    i have tried and can not figure out how to do this?

    Posted 11 years ago #
  2. yuniar

    You can change the "Field Size" property of your text field to do so. There are options to change it to "small", "medium" or "large".
    If you need more precise width setting, you can do it through CSS code.

    First, edit your form's theme, go to the "Advanced CSS" section and put this code:

    #main_body .custom_width input.text{
      width: 300px !important;
    }

    the above would define "custom_width" class that you can apply to any text field and would set the width of the text to 300px.
    To apply the width to the field, go to your field property and then put "custom_width" into the "Custom CSS Class" property.

    To set the width of the form, you can use this CSS code:

    #form_container{
      width: 800px;
    }

    MachForm Founder

    Posted 11 years ago #
  3. jasons
    Member

    hi
    thanks for that.
    it sort of works but not properly

    i can set a single line text field to the correct width as above with the css code, however it doesnt work with paragraph text?
    the paragraph text still changes width as the page is increased and decreased in width.

    also, if i set the custom_width to 200px and the add that custom css to each field, and i set the form_container to 200px, the paragraph text is smaller than the other single line text fields and still changes size as the page width is increased and decreased?

    Posted 11 years ago #
  4. yuniar

    Ah.. yes, paragraph need another different code. You can use this code to target the paragraph field:

    #main_body .custom_textarea_width textarea.textarea{
      width: 300px !important;
    }

    and then use the "custom_textarea_width" css class.


    MachForm Founder

    Posted 11 years ago #
  5. maswayze
    Member

    OK, I tried the suggestions on how to widen the "field size" of the form, and I was able to get it to work with your instructions. I do have a question however.

    On my form, when you click on a drop down field that I created, the Field area is wider, HOWEVER I also see that the "background" area of the field area also is wider. It looks like that the "background" is always twice the size of the active area of the field? How can I use the entire area of the field for the Drop Down area?

    Thanks

    Posted 10 years ago #

RSS feed for this topic

Reply