widget doesnt render when its width is greater than the half of the width of the grid

[gsouf]

I use gridster 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 due 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 property 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>

If i reduce the grid from 12 columns to 6 columns. Any sizes will work.

Actually i did check what is missing, and the probleme is really the width css rule which doesnt exist on the more than half width widget. It is only a render probleme, a "what we can see" problem.

Thanks

[guushamann]

I have Exactly the same problem

my grid is 14 tiles big, and when i do this

    <li data-row="1" data-col="1" data-sizex="7" data-sizey="2">    
        ccccccc
    </li>   

it does not render correctly

[guushamann]

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');

[gsouf]

Works like a charm with max_size_x.

Thanks @guushamann