Table column resize

The TableColumnResize plugin lets you resize tables and individual table columns. It gives you complete control over column width.

Demo

To resize a column, simply hover your pointer over the column edge until it gets highlighted. Drag the column edge until you achieve the desired size.

Dwarf planets of the Solar System

Name	Region	Orbital radius (AU)	Orbital period (years)	Number of moons
Ceres	Asteroid belt	2.768	4.6	-
Orcus	Kuiper belt	39.40	247.3	1
Pluto	Kuiper belt	39.48	247.9	5
Haumea	Kuiper belt	43.22	284.1	2
Quaoar	Kuiper belt	43.69	288.8	1
Makemake	Kuiper belt	45.56	307.5	1
Gonggong	Scattered disc	67.38	553.1	1
Eris	Scattered disc	67.78	558.0	1
Sedna	detached	506.8	11,400	no data

The column resize feature is compatible with the Export to Word feature. The converter will respect the column width set in the editor and retain it in the created .DOCX file.

Installation

After installing the editor, add the feature to your plugin list and toolbar configuration:

import { ClassicEditor, Table, TableColumnResize } from 'ckeditor5';

ClassicEditor
	.create( document.querySelector( '#editor' ), {
		licenseKey: '&lt;YOUR_LICENSE_KEY&gt;', // Or 'GPL'.
		plugins: [ Table, TableColumnResize, /* ... */ ],
		toolbar: [ 'insertTable', /* ... */ ],
	} )
	.then( /* ... */ )
	.catch( /* ... */ );

const { ClassicEditor, Table, TableColumnResize } = CKEDITOR;

ClassicEditor
	.create( document.querySelector( '#editor' ), {
		licenseKey: '&lt;YOUR_LICENSE_KEY&gt;',
		plugins: [ Table, TableColumnResize, /* ... */ ],
		toolbar: [ 'insertTable', /* ... */ ],
	} )
	.then( /* ... */ )
	.catch( /* ... */ );

Common API

The TableColumnResize plugin does not register UI components.

Note

We recommend using the official CKEditor 5 inspector for development and debugging. It will give you tons of useful information about the state of the editor such as internal data structures, selection, commands, and many more.

Contribute

The source code of the feature is available on GitHub at https://github.com/ckeditor/ckeditor5/tree/master/packages/ckeditor5-table.