# Panes

The Splitter provides options for setting the behavior of its panes.

By using these options, you can configure the following pane features:

* [Dimensions](https://www.telerik.com/kendo-vue-ui-develop/components/layout/splitter/panes#dimensions)
* [Resizing](https://www.telerik.com/kendo-vue-ui-develop/components/layout/splitter/panes#resizing)
* [Collapsing](https://www.telerik.com/kendo-vue-ui-develop/components/layout/splitter/panes#collapsing)
* [Scrolling](https://www.telerik.com/kendo-vue-ui-develop/components/layout/splitter/panes#scrolling)

## Dimensions

The [`size`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#size) property controls the dimensions of the Splitter panes. It accepts units in both pixel and percentage values. To control the minimum and maximum size of a pane, use the [`min`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#min) and [`max`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#max) properties of the Splitter [`panes`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterprops#panes) option.

To allow the Splitter to fully and evenly distribute the available space between panes of non-declared size, do not specify the size of at least one pane. Otherwise, if you declare `size` for all panes, the Splitter will throw an error.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/layout/splitter/panes/dimensions/source.txt)

## Resizing

By default, the Splitter enables the user to resize its panes. To disable this behavior, set the [`resizable`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#resizable) property to `false`.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/layout/splitter/panes/resizing/source.txt)

## Collapsing

You can enable a Splitter pane to collapse by setting the [`collapsible`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#collapsible) property to `true`. As a result, the Splitter renders a button which shows or, respectively, hides the pane. To collapse a pane, you can also double-click the split-bar. To render a pane that is initially collapsed, use the [`collapsed`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#collapsed) property.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/layout/splitter/panes/collapsing/source.txt)

## Scrolling

By default, the content of the Splitter panes is scrollable. To disable the scrolling feature, set the [`scrollable`](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops#scrollable) property to `false`.

[Demo Source](https://demos.telerik.com/kendo-vue-ui/layout/splitter/panes/scrolling/source.txt)

## Suggested Links

* [API Reference of the Splitter](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterprops)
* [API Reference of the SplitterPaneComponent](https://www.telerik.com/kendo-vue-ui-develop/components/layout/api/splitterpaneprops)