keep form-pagebreak (back and next) at fixed position at bottom of form?

  • Profile Image
    yazgar
    Asked on August 08, 2011 at 11:47 PM

    Hi,

    I have a 4 page form to be placed in a fixed hight/width div (overflow hidden). Some of the form pages have more content than others causing the back and next buttons to move up or down based on the amount of content. Is there a way for them to be anchored to the bottom of each form page regardless of the height of the form page?

    gaz

  • Profile Image
    brx250
    Answered on August 09, 2011 at 12:57 AM

    Hi gaz,

    Thank you for using JotForm.

    After checking your form, your custom CSS seems to be faulty. I would suggest you remove the second } as shown below.

    Also, your line border-top: none lacks

     You can try using the code below and see if it helps.

    .form-pagebreak { background-color:rgba(255,0,0,0);
    height:15px;
    border-top: none;
    position:absolute;
    top: 360px; }

    Note: You can edit the 360px prior to your liking.

    If you do need further assistance or clarifications, please feel free to contact us.

    ____________________________________________  

     Albert  |  JotForm Support 

  • Profile Image
    yazgar
    Answered on August 09, 2011 at 01:30 AM

    Thanks! Code worked a treat. awesome!

    Perhaps you can help with another problem I'm having with my first set of checkboxes under the "retouching" selection. I want 2 rows, the first row hard up against the left, but the second row needs to moved across to middle more, and I'm trying to keep the text for the checkboxes on a single line as well. I tried messing with the css like so:

    .form-checkbox-item {
    padding-left:5px;
    padding-left:5px;
    font-size: 14px;
    width:45%;
    }

    but as you probably guessed, most of my css knowledge is coming from google lol

    gaz

  • Profile Image
    brx250
    Answered on August 09, 2011 at 05:06 AM

    Hi,

    In that case, try deleting all your custom CSS and replace it with the code below. This should fix your problem.

     

     

    .form-header-group {

    background-color:rgba(255,0,0,0);

    height:15px;

    border:none

    }

    .form-subHeader {

    border:none;

    }

    .form-pagebreak {

    background-color:rgba(255,0,0,0);

    height:15px;

    border-top: none;

    position:absolute;

    top: 290px;

    }.form-all {

    background-color:rgba(255,0,0,0);

    }

    .form-line-active {

    background-color:rgba(209,199,148,0.3);

    }.form-checkbox-item {

    padding-left:30px;

    width:300px;

    margin-right:5px;

    }.form-single-column {width:300px; }

     

     

    You can view the form I cloned from you through this link http://www.jotform.com/form/12204234508. If you want you can clone it too. Hope this helps. 

    If you have any other problems, please feel free to contact us. We would be more than happy to assist you with anything.

    ____________________________________________   

     Albert  |  JotForm Support 

  • Profile Image
    yazgar
    Answered on August 09, 2011 at 05:33 AM

    Albert what can I say. Thank you for all your help. This has solved all my problems!

    Probably the best customer support I've come across on the net...ever!

    Hats off to Jotform for having such great people.

    thanks again

    gaz

  • Profile Image
    brx250
    Answered on August 09, 2011 at 09:07 PM

    Hi gaz,

    We are always glad to help!

    If you do have any other issues in the future, do leave us a message and we will try our best to help you solve them.

    Cheers! And again, thank you for using JotForm.

    ____________________________________________   

     Albert  |  JotForm Support