What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to reduce form width to 286 pixels

    Asked by David on April 02, 2013 at 10:46 AM

    Good morning:

     

    Jotform.com is a great site and tool! It's quite a pleasure to use it, and I'm just starting.

    In using jotform on typepad, is there a way to have the form, and all its fields, fit into the side bar/typelist? The maximum width is 300 px, but there's some padding in there somewhere.

    I've reduced the type size and the size of the text boxes, but still can't fit it all in.

    Here's an example: http://daviddodge.typepad.com/Jotform%20typelist%20cutoff%20problem.jpg

    Thank you very much.

    Have a fine day!

     

    David

    Page URL:
    http://www.sealcoverealestate.com/

    Screenshot
    form width JotForm size jpg maximum
  • Profile Image

    Answered by jefreylandicho on April 02, 2013 at 11:55 AM

    Please try adding this code in your forms style CSS

     

    .form-all { margin: 0px !important; width:300px !important; }

    .form-line { padding: 0px !important; }

    .form-address-line { width: 260px !important; }

    .form-address-city, .form-address-state { width:124px !important;}

    .form-address-table select { width: 130px !important; }

    textarea { width:260px !important;}

    table { width:277px !important; }

    To Inject the custom css code in your form, go to Setup & Embed then click the Preferences Icon. In the Preferences windows, click the Form Styles tab and add the code in the Inject Custom CSS field area.

    You can check the example clone form I made in your account http://www.jotform.us/form/30914913195153

    If you need further assistance, please contact us again.