Trying to Create a Narrow Form

  • Profile Image
    richgeasey
    Asked on January 31, 2013 at 01:28 PM

    I want to create a form 160 wide. I can set that no problem. However when I create a field the entry box hangs off to the right and past the 160 edge. Also, I'd like to scoot the fields more to the left edge of the form. A lot of wasted space. 

  • Profile Image
    pinoytech
    Answered on January 31, 2013 at 01:38 PM

    Hi,

    Can you please share to us the URL of your Form for further assistance?

    Thank you!

  • Profile Image
    richgeasey
    Answered on January 31, 2013 at 04:16 PM

    http://form.jotform.us/form/30306317111134

    See the fields are too much to the right. Also, is there a way to tighten up the vertical seperation? I want it a little tighter together.

    Thanks!

  • Profile Image
    EltonCris
    Answered on January 31, 2013 at 11:19 PM

    Hi,

    To remove the left padding of form contents, inject this CSS codes to your form.

    .form-line {

    padding-left: 0 !important;

    }

    Follow this guide: How to Inject Custom CSS Codes to your Form

    Also, is there a way to tighten up the vertical seperation? I want it a little tighter together.

    Here's a guide: How can I change spacing between questions?

    Let us know if you have further questions. Thanks!

  • Profile Image
    richgeasey
    Answered on February 01, 2013 at 12:42 PM

    Thank you Elton! Is there a way to further push up the Submit form. The entry forms look perfect, but I'd like to move it up a few more pixels by itself.

    Rich

  • Profile Image
    pinoytech
    Answered on February 01, 2013 at 01:16 PM

    Hi Rich,

    Inject this codes into your form.

    .form-submit-button {

    margin: 0 0 0 0 !important;

    }

    If need further assistance, do let us know.

    Thank you!

  • Profile Image
    richgeasey
    Answered on February 01, 2013 at 02:30 PM

    Thanks pinoytech!

    OK, almost there now. I added this but did not see results as I have added two HTML boxes. One above and one below the submit box. How can I close that gap as well.

    Appreciate the fast responses!

  • Profile Image
    Deygus
    Answered on February 01, 2013 at 03:01 PM

    Would something like this work http://form.jotform.us/form/30315479884160? All I did was change the question spacing to 0. If not then this would have to be adjusted using some more custom css to close the gaps better if that's more what you prefer? 

  • Profile Image
    richgeasey
    Answered on February 01, 2013 at 03:30 PM

    Deygus, I think for now that looks good enough! I'll look at it once I get all of the moving parts working and see if I can tighten it up a bit more. But hey, I am 90% there and that's great.

    Thanks!

  • Profile Image
    Mike_T
    Answered on February 01, 2013 at 03:52 PM

    You may also replace your <p> tags on the HTML fields with <span> or <div> for example. It should clean some unwanted space.

    http://form.jotformpro.com/form/30316344059954

    Please let us know if you need any further assistance.

  • Profile Image
    richgeasey
    Answered on February 01, 2013 at 04:17 PM

    Yup, that worked!

    Thanks Mike.

  • Profile Image
    Mike_T
    Answered on February 01, 2013 at 04:19 PM

    It is nice to hear that.

    You are quite welcome, Rich.