Welcome to our Documentation
All
Print

Table Size.

Tables are useful tools for websites that allow organizing the data in the most convenient format. With the help of the Data Tables plugin, building tables has become much easier and doesn’t require coding skills. If you already have a ready-to-use table created with the Data Tables plugin, but you need to change its size, you’ve come to the right place. 

How to change the size of a table? 

The simplest way to regulate the width of a column is manually drag and drop.

Changing Size

To change the size of a table, you need to proceed to the Options tab in the plugin dashboard and click on the Appearance tab. 

Here you’ll see the Auto table width option which automatically divides the width for the columns between 100%. 

You can also set table width manually and the width of the columns will be set from the Fixed table width option (you find it on the Extended builder tab) or calculated depending on the width of the columns in the table editor.

If you do not want to apply automatic width, you need to uncheck the Auto table width option and see the required values manually by using the Fixed table width numeric dropdown. The values are set in px or %. If you select the Disable option the table width will be adjusted by table content.

When you set the width manually, you can check the Compact table box to reduce the amount of whitespace in the table.

If you scroll down to the Appearance section and enable the Use custom styles checkbox, you’ll get a few other customization settings where you can set the Fixed layout option which allows setting all columns of the same width.

Size

Another way to manage the width of the columns is to use the Extended builder tab and click the Resize Columns icon. Here in the newly opened window, you may set the width for your existing columns.

The value can be set in pixels or percents, however, it is recommended to use px, if you want the width to be the same as you need because the percentages can be recalculated by different browsers.

To clear fixed columns width for all table columns click the Clear Fixed Width button.

Fixed Width
Previous Table loader
Next Table styling
Options
Shopping Cart