I'm trying to set up a second row to appear instead of formatting the extra columns as a list. It looks like the way Tabulator does this is by making a table with the column titles bolded on the left with the value on the right.

However, this means I can't resize the column for the collapsed content. I'm hoping to at least change the formatting so the table shows as an actual table and not a list.

I run Tabulator on my own machine so that I can change some of the css and js directly without having to add any extra code withing the HTML file. I believe this is the snippet of code I need to change in order to make the collapsed content show as an extra row (or at least a table with multiple columns) rather than a list:

key: "formatCollapsedData",
      value: function formatCollapsedData(data) {
        var list = document.createElement("table");
        data.forEach(function (item) {
          var row = document.createElement("tr");
          var titleData = document.createElement("td");
          var valueData = document.createElement("td");
          var node_content;
          var titleHighlight = document.createElement("strong");
          titleData.appendChild(titleHighlight);
          this.langBind("columns|" + item.field, function (text) {
            titleHighlight.innerHTML = text || item.title;
          });

          if (item.value instanceof Node) {
            node_content = document.createElement("div");
            node_content.appendChild(item.value);
            valueData.appendChild(node_content);
          } else {
            valueData.innerHTML = item.value;
          }

          row.appendChild(titleData);
          row.appendChild(valueData);
          list.appendChild(row);
        }, this);
        return Object.keys(data).length ? list : "";
      }
    }]);

    return ResponsiveLayout;
}(Module);

Thank you in advance for any help!