# Auto Item Height

The Kendo UI for Vue `SchedulerViewSlot` can automatically extend depending on the content inside it, or take a predefined `height`.

This feature is available in `horizontal` configuration of the events, which can be observed in the following views:

* `TimelineView`
* `DayView`— only in the `allDay` section.
* `Week`— only in the `allDay` section.
* `WorkWeek`— only in the `allDay` section.
* `MonthView`

> This feature is compatible with the [Adaptive Slot Height](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/adaptive-slot-height) of the `SchedulerViewSlot`.

In order to set enable the auto item height functionality, set the `itemStyle.height` property of the `SchedulerViewItem` to `auto`:

```js
<template #itemRender="{ props }">
      <SchedulerViewItem
        v-bind="props"
        :itemStyle="{
          height: 'auto',
        }"
      />
</template>
```

The following example demonstrates the `auto` item height feature in action:

[Demo Source](https://demos.telerik.com/kendo-vue-ui/scheduler/auto-item-height/overview/source.txt)

## Constant Item Height

In order to set a `constant` height of an item, set its `itemStyle.height` to a specifix value, representing the height:

```js
<template #itemRender="{ props }">
      <SchedulerViewItem
        v-bind="props"
        :itemStyle="{
          height: '45px',
        }"
      />
</template>
```

The following example demonstrates `constant` item height in action:

[Demo Source](https://demos.telerik.com/kendo-vue-ui/scheduler/auto-item-height/constant/source.txt)

## Suggested Links

* [API Reference of the Scheduler](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/schedulerprops)
* [Scheduler Slot Customization](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/customization/slot-template)
* [Scheduler Item Customization](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/customization/event-template)
* [Adaptive Slot Height](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/adaptive-slot-height)