How to change Configurable List Widget's font color and adjust the width?

  • LTHS
    Asked on December 8, 2017 at 3:50 PM

    We are working with a configurable list widget, and we need the css code to change the font color from black to white. Thank you very much in advance for your help. 

  • Ardian_L
    Replied on December 8, 2017 at 4:49 PM

    I have replied to another thread you have opened. If this is about another issue, please provide the url of the form and I can assist you.

  • Jed_C
    Replied on December 8, 2017 at 5:29 PM

    Hi there,

    Just wanted to add if the below script may help you change your font color for the widget.

    th{

    color: #FFFFFF;

    To inject this, you can follow our guide here or you can watch my sample screencast here.

    Let us know if you have any questions or if you need further help.

  • LTHS
    Replied on December 9, 2017 at 1:04 PM

    Jed C.  thank you.  The CSS code that was given for another widget didn't work for the configurable list widget.  One last request, my widget goes off the colored background.  Is there a way to have the configurable widget to be displayed vertically and not horizontally?  Or is there a way to shrink it so it fits in the background?

    Form URL: http://form.jotform.com/LTHS/signsofthetimes

  • Jed_C
    Replied on December 9, 2017 at 3:16 PM

    I have cloned your form and was able to adjust the width of the "Configurable list" widget. Please inject the CSS script below to reduce input and select width.

     

    input[type="text"], select {

       width: 108px;

    }

    td, input {

        width: 70px;

    }

    td:nth-child(4), td:nth-child(4) input {

        width: 50px;

    }

    tr{font-size : small;}

     

    The output will look like my sample screenshot below:

    1512850469conf list css Screenshot 10

    Let me know if you have any questions.