Make configurable list widget responsive only when using mobile browser

  • Clintluna
    Asked on October 7, 2018 at 6:44 PM

    Hi, Can you just copy/past what the correct code would be to make the configurable list workable "on all devices"? (The code to make it mobile compatible makes the list vertical, but I want it to be horizontal on a laptop to make it more compact and then stack vertically only when necessary, eg. on a mobile device).

    I tried a few times with the instructions above, but it's not working and not sure if I'm just misinterpreting something.

    Would be very helpful if you could do that.

    Thanks!!

  • jonathan
    Replied on October 7, 2018 at 8:07 PM

    This is actually what the user guide mentioned.

    How to make it responsive in all devices including desktop?
     
    If you want to make the configurable list widget responsive in all devices, 
     
    1. Remove the first line @media screen and (max-width:480px){ and the last line } found in the above CSS codes (text in red).
     
    iframe[src*="configurableList"] {width: 100% !important;}
     

    So if you only need it to be responsive specifically on mobile browsers only, do not apply the steps from the instruction mentioned.


  • jonathan
    Replied on October 7, 2018 at 8:08 PM

    You can test my test form https://form.jotform.com/82797854525978

    It should have responsive design only if using mobile browser.