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 change size of button on Mobile Platform

    Asked by alexosit on February 09, 2016 at 10:46 AM
    If I can pick your brain for one more thing: I've created the forms mentioned previously, but when I add them onto my Joomla website, the button stretches across the full width of the containing module. I'm wondering if I can have the button displaying only in the middle, similar to what it looks like in the 'preview' of the form...

    Expectations: 

    Reality:

     

    The form link is: https://form.jotformeu.com/60385132821349

    And it's embedded here: http://www.onestopit.com/security-services/194-it-security-awareness-training 

  • Profile Image
    JotForm Support

    Answered by beril on February 09, 2016 at 11:04 AM

    First of all thank you for detailed information. We would appreciate it if you could add the CSS code below from designer.

     

    @media only screen and (max-device-width: 550px){

        .form-submit-button {

            width : 80px !important;

        }

    }

     

    Here is how it works:

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

  • Profile Image

    Answered by alexosit on February 10, 2016 at 04:04 AM

    Hi Beril,

    I tried that solution and it did not work because I needed the form to adjust according to the width of the containing element, not the device screen itself. So I changed it to the following and it worked like a charm:

    @media only screen and (max-width: 550px){

        .form-submit-button {

            width : auto !important;

        }

    And the following works as well:

    .form-submit-button {

            width : auto !important;

        }

     

    I've not noticed the CSS tab in the designer options before, so thanks a lot for pointing that out!

  • Profile Image
    JotForm Support

    Answered by beril on February 10, 2016 at 06:44 AM

    That's great. Thank you for sharing your solution with us. We are glad to hear that the issue has been resolved for you.

    If you need any further assistance feel free to contact us. We will be happy to assist you.