calculate height of the div when resize in gridstack

[kvkv]

I am using gridstack to display different type of data. I display heading and content on one gridstack item. gridstack items are resizable, when we resize the gridstack items height and width both resizable. I need the content to display at verticle middle of the content div. I used display:table,verticle align : middle, display : table-cell properties. It is working fine when we give the height to the parent. But when we resize the height is changed. the content is not exact middle at this situation.

What I wanted to do is..when resize the gridstack item, caluculate total div height,header div height. And substract header div height from total div height and assign the height to content div. So the content is exact verticle middle whatever resize to increase height of the gridstack item.

We have resize option for window. But I want resize option for the gridstack item div. I need get the height of the gridstack item height whenever resize. If I get the height of the item whenever resize ,I can implement remaining process.

I attached the image for referrence

[radiolips]

@kvkv You can easily check for resize on the widget. Simply add a listener for when it has resized. One method to do this could be to listen to gridstack's change. When this happens, you can loop through the changed items, which is what change returns, and update your widget however you'd like. Let me know how this goes for you or if you need more assistance!