Can I change the width on a Configurable List?

  • Profile Image
    Arnouts
    Asked on January 13, 2022 at 10:52 AM

    Hello,

    I am attempting to change the width of my items within a Configurable List. I would like the questions to fill the page and not have a double line (Ex. Property Damage).

    Could you assist with making these fit the page?

    Thank you!

    Screenshot
  • Profile Image
    Katherine_W
    Answered on January 13, 2022 at 01:15 PM

    Hi there,

    Happy to help!

    This may be achievable using Custom CSS. Please allow me a little time to investigate and put together a potential solution for you.

    Thank you in advance for your patience and understanding!

  • Profile Image
    Katherine_W
    Answered on January 13, 2022 at 02:00 PM

    Hi again,

    Could you kindly inject the following Custom CSS into your form?

    .translatable {

     min-width: 174px !important;

    }

    This is the expected result:

    1642100402_61e076b2882ec_

    I hope this helps! Please let us know if we can assist further.

  • Profile Image
    Arnouts
    Answered on January 13, 2022 at 02:11 PM

    I have attempted to do so and this is my result (photo below). Am I doing so correctly or could you further advise me.


    Thank you!!1642101060_61e07944c9c85_Jotform Number

  • Profile Image
    ashwin_d
    Answered on January 13, 2022 at 02:35 PM

    I have injected few custom CSS code in your form and widgets. Please check your form and see if it shows the configurable list widgets correctly. Please check the screenshot below on how the widget is appearing in your form:

    1642102486_61e07ed6b7a68_configList.png

    Do get back to us if you need any other changes.

    We will wait for your response.

  • Profile Image
    Arnouts
    Answered on January 13, 2022 at 02:47 PM

    Hello,


    Thank you, the words look great! Are you able to adjust the "Please Select" portion to also be larger and evenly spaced? Similarly to the example from above in Katherine's second response.


    Thank you!1642103245_61e081cdd5f3c_Jotform Number


  • Profile Image
    JohnRex
    Answered on January 13, 2022 at 03:30 PM

    Please add this to each configurable list widget:

    select.form-dropdown {
      width: 174px!important;
    }

    And this will be the result:

    1642105759_61e08b9f0def6_

    Here's how:

    1642105819_61e08bdb244c8_

  • Profile Image
    Arnouts
    Answered on January 13, 2022 at 03:51 PM

    That worked perfectly, thank you very much for the help!