Configurable list widget - main label text is encroaching on first field label

  • lritter
    Asked on February 7, 2020 at 9:39 AM

    I need to expand the size of the Configurable List Widget's main label. So, I used the following code and it works and looks great on the desktop and mobile in landscape orientation. However, on mobile in portrait orientation, it looks like the screen shots below. Thank you!

    /*Adjust Height of Labels 

    in Configurable List Widget*/

    #label_362,#label_368,#label_332,

    #label_371,#label_372,#label_373 {

      height: 70px!important;

    }

    1581086313JotForm4 Screenshot 10

    1581086328JotForm5 Screenshot 21

    1581086340JotForm6 Screenshot 32

  • Jimmy_D
    Replied on February 7, 2020 at 11:04 AM

    Hi, Thanks for reaching out to us. I am working on a solution. I will update you shortly on this thread. 

  • David JotForm Support Manager
    Replied on February 7, 2020 at 1:09 PM

    After troubleshooting with my colleague the style issue in mobile devices, we have created this code to fix the issue, please inject it as shown on this guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

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

    #label_362,#label_368,#label_332,

    #label_371,#label_372,#label_373 {

      height: auto !important;

    }

    }

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

    #label_326{

        height: auto !important;

        width: 102% !important;

    }

    }

    Example:

    Configurable list widget   main label text is encroaching on first field label Image 10

    Configurable list widget   main label text is encroaching on first field label Image 21

    Configurable list widget   main label text is encroaching on first field label Image 32

    Note: although there is a mobile preview option, it may sometimes not be 100% accurate, we recommend you to check in you real mobile device too. 

    Please check my clone version: https://form.jotform.com/200374436998971

    Let us know if you need more help.

  • lritter
    Replied on February 7, 2020 at 1:17 PM

    SWEET!!! It looks super good. Thank you so much for taking the time to assist me!