Gridstack.js: Grid full height

[jorsai]

First of all, congratulations for your plugin, is awesome.

Here is the question. Is it possible keep the grid with full height?
It is at the bottom of my page and so difficult to fill or move new elements inside.

(Sorry for my English!)

Thank you!

[csavage1994]

You want the grid to be 100% of the screen height? You should be able to do something like this

.someClass {
    height: 100%
}

Then just put your grid inside an element with your someClass class. If you want it to always be on the screen, you can add position: fixed so scrolling the page doesn't affect the position.

[gyurisc]

@csavage1994

First of all, this is an awesome plugin. Thanks for creating it!

I am interested also in making the grid full size and added the extra style you mentioned in your post. However as I start rearranging the widgets and make the grid only one widget tall the grid itself resizes and becomes one widget tall.

I am not saying that this behaviour is good or bad, but just curios if I can override this behavior somehow...

[jorsai]

Of course @csavage1994 , what a silly question I asked.

[jorsai]

@gyurisc , same problem to me. Do what csavage said, and put your grid styles in the container div, not in the grid.

It will keep resizing, but if you style the container, no one will see the resize.

[clarknelson]

you can also try 100vh instead of 100%

[csavage1994]

@jailbot's solution works as well, mine will style the grid element to 100% of the containing element, using vh will ensure it takes up the full height I believe. Here's a reference to the difference between the two if you're curious! http://stackoverflow.com/questions/27612931/styling-html-and-body-selector-to-height-100-vs-using-100vh

[radiolips]

@jorsai It sounds like you were successful in incorporating @csavage1994 's recommendation. I'm closing this ticket, but if you're still experiencing issue, please feel free to reopen.

[ronvanpol]

I too am facing the same problem. Because I am using nested grids, the solution of using a container with 100% height doesnt work. Would it be possible to add an option to indicate that the height of the grid should not be updated, so basically making the calls to "GridStack.prototype._updateContainerHeight" optional?