Docs

Documentation versions (currently viewingVaadin 8)

Vaadin 8 reached End of Life on February 21, 2022. Discover how to make your Vaadin 8 app futureproof →

Board

The vaadin-board is a Polymer element for creating flexible responsive layouts and building nice looking dashboards. The vaadin-board key feature is how it effectively reorders the widgets on different screen sizes, maximizing the use of space and looking stunning. Vaadin Board is using Polymer 2.

Features

  • Four and three columns based layout for laying out things the way you like it.

  • Responsive design, works on all screen sizes, it rearranges child elements based on available space.

  • Element responsiveness. Not only is the component itself responsive, but each row reacts individually to the space given to it in a responsive way.

  • Allows to divide your layout into regions by using vaadin-board-row.

  • board-cols attribute makes one widget flow over multiple slots. This way you can build row configurations where for example you have one widget that takes 75% of the space and another that takes 25%, 25-50-25 or 33-67.

  • Supports nested regions. You can put a new row within another row to build how ever complex layouts that you want in a simple way.