Fork me on GitHub

# Handsontable

a minimalistic Excel-like data grid editor for HTML, JavaScript & jQuery

## Scrollbars

This page shows how to configure Handsontable scrollbars:

- Vertical and horizontal scrollbars
- Single scrollbar (stretch last column)
- Single scrollbar (stretch all columns)
- Single scrollbar (hybrid mode - default)

## Vertical and horizontal scrollbars

If you want scrollbars, just set container width, height and `overflow: scroll` in CSS.

## Single scrollbar (stretch last column)

It is also possible to configure only a single scrollbar. The following example creates one by specifying only the container height and `overflow: auto` in CSS.

## Single scrollbar (stretch all columns)

If the table content is not as wide as the container width, the table will be stretched to the container width. The default horizontal stretch model is to stretch the last column only (by using `stretchH: 'last'` option).

Other possible stretch modes are `all` (stretches all columns equally, used in the below example) and `none` (not stretching).

## Single scrollbar (hybrid mode - default)

Sometimes you don't know if horizontal scroll bar will be needed. That's why `stretchH: 'hybrid'` is the default column stretching mode

When horizontal scrollbar is NOT visible, it acts as `stretchH: 'none'`. When horizontal scrollbar is visible, it acts as `stretchH: 'last'`.

For more examples, head back to the main page.

Handsontable © 2012 Marcin Warpechowski and contributors.
Code and documentation licensed under the The MIT License.