How to display buttons properly in mobile devices?

  • Tanner
    Asked on April 6, 2017 at 4: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! :)

    Jotform Thread 1113489 Screenshot
  • Kevin Support Team Lead
    Replied on April 6, 2017 at 5: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.