Gridster, widget doesnt render when its width is more than the width of the grid

Question

I use gridsterJS with a grid of 12 columns.

I add widgets dinamycally with add_widget() method.

Widgets are shown correctly. But if i put a widget with sizex of 6 or more it appears in the DOM and its height is correct but its width is 0px.

Then the widget is present, but du to the 0px width, we cant see it visually

In the following sample only one of the two is visible. If i change manualy the sizex from 7 to 6. Then the two widgets are ok :

<ul style="position: relative; height: 180px;">

    <li class="gs_w" style="opacity: 1; display: list-item;" data-col="1" data-row="3" data-sizex="7" data-sizey="1"></li>
    <li class="gs_w" style="opacity: 1; display: list-item;" data-col="1" data-row="1" data-sizex="3" data-sizey="2"></li>

</ul>

Answer 1

Answered on github : https://github.com/ducksboard/gridster.js/issues/200#issuecomment-20469120

Found the problem, you have to set max_size_x and max_size_y

gridster=$(".gridster ul").gridster({
    widget_margins: [6, 6],
    widget_base_dimensions: [59, 59],
    max_size_x: 9,
    max_size_y: 8
}).data('gridster');