How to setup the "Fancy Range Slidr" widget so that it is mobile responsive

  • Profile Image
    Asked on December 28, 2014 at 05:00 AM
    The fancy slider could work but is not responsive
    and is there any way to change the color from red?
  • Profile Image
    Answered on December 28, 2014 at 08:25 AM

    Hi akt1,

    The Fancy Range Slidr, can be made responsive by Injecting Custom CSS into your form.

    You will need to find the ID for the Fancy Range Slidr on your form.

    When previewing the form, right click on the widget and select "Inspect Element"

    Look for the ID that says "customFieldFrame"

    Using the ID for your Fancy Range Slidr, inject the following CSS:

    @media only screen and (max-width: 40em){

     #customFieldFrame_1 {

     width: 300px !important;


    Here is a preview of the Widget when viewed on a mobile phone:

    Sample Form

    Your question regarding changing the font color of the slider, has been moved to a new thread: 

    It will be addressed there.

    Please inform us if you need further assistance.

  • Profile Image
    Answered on December 28, 2014 at 03:53 PM

    Thanks this worked perfectly,

    Could this solution work on another widget I have the same problem on the The Matrix Dynamique widget, I have been waiting for a solution on this thread non of the suggested remedies have worked

    Matrix Dynamique widget not responsive



  • Profile Image
    Answered on December 28, 2014 at 06:53 PM

    Please expect a response in the other thread as this is not related to the same widget.

    Kind regards.