I want to change position of Progress bar widget

  • RamasamyVenugopal
    Asked on June 22, 2016 at 10:08 AM
    Hi, the link to the code is no longer valid. Is there a solution?
  • beril JotForm UI Developer
    Replied on June 22, 2016 at 10:20 AM

    I've cloned your form and injected the code that was provided by my colleague. It is working fine on my side. We would appreciate it if you could inject the CSS code below:

    .form-all {

    position: relative;

    }

    .progressBarContainer {

    position: absolute;

    bottom: 0;

    width: 690px !important;

    background: #FFF;

    z-index: 9999;

    }

    .form-submit-button {

    margin-bottom: 80px;

    }

    I want to change position of Progress bar widget Image 1 Screenshot 30

    Here is how it works on my side:

    I want to change position of Progress bar widget Image 2 Screenshot 41

     

    If you have any question or issues, please do not hesitate contacting us. We will be glad to assist you.

  • RamasamyVenugopal
    Replied on June 22, 2016 at 10:29 AM

    It is hiding the Next button

    I want to change position of Progress bar widget Image 1 Screenshot 20

  • Charlie
    Replied on June 22, 2016 at 1:11 PM

    May I know what form you are working on? I presume its the form titled "OAD Project Proposal 2016"? I don't see an progress bar widget added on that form.

    May we also know if you want it to stick on the bottom of the screen, meaning, if you scroll down you should still see it displaying in your screen overlapping other fields. Or do you want it to stick at the very bottom of the page? 

    You could try adding this custom CSS code:

    .progressBarContainer {

        position: fixed !important;

        bottom: 0;

        margin-left: auto !important;

        margin-right: auto !important;

        max-width: 700px !important;

        z-index: 999999;

    }

     

    See if that one works.