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

    Bottom of forms cut off when changing border attribute

    Asked by longo on January 17, 2012 at 07:52 AM

    I had a box shadow inset border on my form and changed it to box shadow which cut off the bottom of both my forms, I've tried adding a margin-bottom attribute and even giving it a height attribute, neither have had any affect. They both look OK in preview but not live. I would be grateful if you could take a look.

    Page URL:
    http://www.leathersolutions.org/contact-us.php

  • Profile Image

    Answered by pinoytech on January 17, 2012 at 09:25 AM

    Hi longo,

    Have you tried to use iFrame? If not, here's a guide on how to get your form's iFrame code. Follow the steps below.

    1. Go to Setup & Embed

    2. Click Embed Form

    3. Click iFrame

    Hope you find this information helpfull.

    For further assistance, please don't hesitate to contact us! Thank you for using JotForm!

  • Profile Image

    Answered by longo on January 17, 2012 at 10:22 AM

    Hello and thanks for your reply, I don't like using the iframe as it creates a space under the form and pushes everything else down, this has been fine until I changed the border so it has to be that causing the problem.

  • Profile Image

    Answered by fxr on January 17, 2012 at 05:40 PM

    Hello Longo,

    Can you try adding some Custom CSS:

    From the Setup & Embed toolbar, click on the Preferences icon, select Form Styles tab and in the Inject Custom CSS text area, add the following:

    .form-all {height:560px !important;}

     

    Try experimenting with different values for 560 if that size isnt quite right. 

  • Profile Image

    Answered by longo on January 18, 2012 at 03:58 AM

    Hi Fxr, I did try adding a height attribute, it extended the form but the bottom 'shadow' was still cut off. As I said above the form was fine with an inset shadow just not with this configuration, its all a bit strange.

  • Profile Image
    JotForm Support

    Answered by idarktech on January 18, 2012 at 05:31 AM

    Hi longo,

    Can you please try:

    .form-all{

    max-height: 570px !important;

    }

    If this doesn't work, please let us know for your further assistance. Thank you so much!

  • Profile Image

    Answered by longo on January 18, 2012 at 05:50 AM

    Hello idarktech, unfortunately that doesn't do anything even after increasing/decreasing the px value

  • Profile Image
    JotForm Support

    Answered by idarktech on January 18, 2012 at 07:20 AM

    Longo,

    Apologies for not responding you on time, have you already tried injecting margin-bottom? Like below? If not, please give it a try and tell us if this still doesn't help. I just tested it on my page and it fixes after injecting margin-bottom. Thank you so much for your patience.

    .form-all{

    margin-bottom: 20px !important;

    }


  • Profile Image

    Answered by longo on January 18, 2012 at 09:52 AM

    Hi idarktech, no need to apologize your replies have been very prompt, I did try the margin attribute and it didn't work. I've now pasted the full source code into my site and that seems to have worked OK, thanks for your help with this.