CSS & Configurable List Widget | How to control column size

  • Profile Image
    Asked on July 14, 2016 at 08:05 AM

    I'm working with the Configurable List Widget and I have a need for 11 column elements.  Because of this, my widget is wider than the mobile device.  

    How do I use CSS to control the width of various columns?   Many of my columns will only require an entry of 3 characters, but the current format is providing much more "cell" space than 3 columns.  As a result, the overall widget is much "wider" than it really needs to be.

  • Profile Image
    Answered on July 14, 2016 at 09:35 AM

    I am checking it and will send you further updates shortly.

  • Profile Image
    Answered on July 14, 2016 at 10:06 AM

    You can achieve it by writing the custom css code for your specific widget. I am able to see you have already added some custom css code into your "Configurable list Widget". So please add the below css code:

    table {

        width: 50%;


    input[type=text] {

        width: 27px;


    Please check the below screenshot:


    You can also verify the design on my Clone form at below URL:


    If you face any issue or need further assistance, feel free to revert back.