How to display buttons properly in mobile devices?

  • Profile Image
    Tanner 
    Asked on April 06, 2017 at 04:39 PM

    I have a developer creating a custom survey using your Jotform platform. Everything looks good so far, except for the buttons on mobile. I was wondering if you would know of any possible way to have the buttons stacks one on top of the other, as opposed to have them running side by side. If so, I'd love to hear from you. I've included an image to give you an idea of what it looks like now. I look forward to your response! :)

  • Profile Image
    Kevin_G
    Answered on April 06, 2017 at 05:59 PM

    Please, try injecting the following CSS code to your form: 

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

        span.form-radio-item {

            width: 100% !important;

        }

     

        .form-all .form-section.page-section:nth-child(4) .form-radio-item {

            width: 100% !important;

            

        }

     

        .form-all .form-section.page-section:nth-child(4) .form-radio-item label{

            min-height: initial !important;

        }

    }

    This guide will help you to do it: How-to-Inject-Custom-CSS-Codes

    Here's a cloned form of yours where you can see the result: https://form.jotform.com/70956594053969 

    If you have any question, let us know.