Fit grid to content size


Is there a way to set the grid/columns width to the width of the content? Currently, I have multiple columns. On larger screens, the grid takes up all of the width of the screen and everything can fit. On smaller screens, however, the grid takes up the full width of the screen and, because the screen is too small to fit the content, the overflow of the different cells are hidden, causing clipping. Is there a way to set the grid so that it adjusts to the width of the content? On a smaller screen, I would like the grid to be larger than the screen, fitting the size of the columns to the contents, and have the ability to scroll to the side to view columns off screen. Is this possible, or do I need to use CSS to account for the most popular screen sizes and adjust the width of the grid with educated guesses?

I’ve tried working with enableAutoWidth(true) but it doesn’t seem to be doing anything. Any help is greatly appreciated!


You may try to set the widths of your columns in the percentages of the container width using the setInitWidthsP() method: … dthsp.html