The animated heading widget in the form is not mobile responsive

  • Profile Image
    Nejcz10
    Asked on January 29, 2018 at 06:48 PM
    The Place Pre-Order button (at the very top) doesn't show correctly unless I include the “Print“ button, which then also doesn't display correctly on mobile...
  • Profile Image
    BDAVID
    Answered on January 29, 2018 at 10:01 PM

    Please inject the following CSS code: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

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

    #id_135{

        width: 100% !important;

    }

    }

    Result:

    1517281246orderform.png

  • Profile Image
    Nejcz10
    Answered on February 08, 2018 at 05:57 AM

    Thanks- this worked for the animated text, however, the “Submit“ button (in our case Place pre-order button“) still isn't displayed correctly on mobile (you can see it at the very bottom)


    1518087414IMG_2212.PNG

  • Profile Image
    Kiran
    Answered on February 08, 2018 at 09:29 AM

    Could you try replacing the code provided earlier with the following code:

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

    #id_135{

        width: 100% !important;

    }

    .form-buttons-wrapper button {

        width: 50%;

    }

    }

    Let us know if you need any further assistance. We will be happy to help.