We are having a style formatting problem for mobile devices

  • Profile Image
    loganpeakdental
    Asked on December 14, 2017 at 04:16 PM

    Hello jot form Friends :)

    1) We are having a formatting problem with our Authorize.net integration for mobile devices.  (see screenshot)  Is there a way for us to fix the problem with the parenthesis going to the next line right under select your savings plan?

    2) Is there a way to make the radio buttons larger on mobile?  sometimes is a bit difficult to press them

    3) We have some simple math calculations going on in this form... however, if they have selected on part of the form list already, but then go to the first question and swap to a different plan, it doesn't remove the current calculation (because it is still selected in the radio buttons that were just hidden and swapped with a different list because of the 1st choice question).  Is there any way to get that reset if someone were to change their mind in the middle of filling out their form?  I'm drawing a blank on how to do that...

    Thank you for you help! 


  • Profile Image
    jonathan
    Answered on December 14, 2017 at 07:33 PM

    As suggested already please inject the custom CSS code on your form

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

    screen and (max-device-width: 767px) and (orientation: portrait),

    screen and (max-device-width: 415px) and (orientation: landscape) {

        /*fixes parenthesis problem*/

        .form-product-custom_price {

            width: 100px !important;

        }

        /*fixes radio buttons size problem*/

        .form-radio {

            width: 20px !important;

            height: 20px !important;

        }

        .form-radio-item label {

            vertical-align: bottom;

        }

    }



    It should work and will work like this

    1513297900zzz 2017-12-15 08.28.32.png


    the other question is about a different feature. We will fix it here 

    https://www.jotform.com/answers/1324042