Setting maximum column width with Tabulator

Question

I have a tabulator grid with fitDataFill layout. Is it possible to set a maximum width for some columns?

The [width] property seems to set a fixed width (even if the automatic layout would assign a smaller width based on the actual data) and [minWidth] specifies the minimum width (also for interactive column resizing).

score 2 · Answer 1 · answered Feb 11 '19 at 09:22

2

You can use CSS to set this if you want to stop a user resizing the column beyond a certain width. Tabulator adds a tabulator-field attribute to all cells and column elements, so if you wanted to limit the width of a column with a field name of "gender" you would need to use the following CSS:

.tabulator [tabulator-field="gender"]{
        max-width:200px;
}

answered Feb 11 '19 at 09:22

Oli Folkerd

7,510
1
22
46

Thanks! But I was actually looking for the opposite: specify a maximum width to be used by the automatic layout (when the content is too wide), but let the users increase the width interactively if they wish. – Alain Frisch Feb 12 '19 at 10:56
1

i see, width property is your best shot there, the user can still resize beyond it if they wat – Oli Folkerd Feb 12 '19 at 11:02

score 0 · Answer 2 · answered Aug 18 '21 at 19:16

Late to the party, but just had the same question. From the documentation (v4.9):

var table = new Tabulator("#example-table", {
    columnMaxWidth:300, //maximum column width of 300px
    columns:[
        {title:"name", field:"name", maxWidth:false} //remove max width on this column
    ]
});

If you use autoColumns (which automatically adds columns from data field names) you need to use autoColumnsDefinitions (insted of columns).

var table = new Tabulator("#example-table", {
    columnMaxWidth: 300, //maximum column width of 300px
    autoColumns: true, //create columns from data field names,
    autoColumnsDefinitions: [
        { field: "Foo", maxWidth: false }, //don't limit width of Foo column
        { field: "Bar", maxWidth: false }
    ],
});

Setting maximum column width with Tabulator

2 Answers2