Hi, I have a grid with horizontalScroll I want to disable this scroll and adapt the grid width to every screen size dynamicly.have you any idea please?
Hi,
The first thing is to use flex/expand ratio/percentage widths for all columns, so that they will shrink/grow with the size of the grid. After that, you can start hiding/showing columns based on the width of the browser viewport, programmatically.
And of course the width of the grid root element needs to be flexible.
There’s not built-in way to disable to scrolling, but you get basically the same effect if you make sure your column widths never exceed the width of the grid.
Hi Jouni,
but how to avoid horizontal scrollbar, which appears right after vertical scrollbar displayed and thus eating some space from grid? In such a case, I prefer not showing horizontal scrollbar.
Hi Maxim,
That sounds like a bug, if your data/columns should fit inside the grid viewport. By default the column widths will be computed so that the data is not truncated, so if you have long text in the data you will get a horizontal scrollbar. To avoid that, you can set the column width and/or flex properties.
If you can’t get to work like you want to, please open an issue in GitHub for vaadin-grid. If possible, add a test case where the problem is visible (jsbin/jsfiddle/codepen/plunkr).