Grid gets small when a user changes column width

Suite and Optimus Suite 5
#1

I’m getting issues when a user resizes one column, the whole grid began to shrink and the column width still the same
I’m using bootstrap 3.3.7 and here is my code


<div id="gridbox" style="width: 100%;height: 450px;"></div>

mygrid = new dhtmlXGridObject('gridbox');	
      mygrid.setImagePath(".../dhtmlxSuitePro/dhtmlxGrid/codebase/imgs/");
      mygrid.setHeader("X,X,X,X,X,#cspan,X,X,X,X,X,X");   mygrid.attachHeader("#text_filter,#text_filter,#text_filter,#text_filter,,#text_filter,#text_filter,#text_filter,#text_filter,#text_filter,#text_filter,#text_filter");
      mygrid.setInitWidths("*,*,*,80,40,*,*,*,*,*,*,90");
      mygrid.setColAlign("left,left,left,left,center,left,left,left,left,left,left,left");
      mygrid.setColTypes("ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro,ro");
      mygrid.setColSorting("str,str,str,str,str,str,str,str,str,str,str,str");
      mygrid.enableMultiline(true);	
     mygrid.setSkin("material");
      mygrid.init();
 mygrid.parse(js,"json");

The initial size

After trying to adjust column width with the mouse

#2

Your bootstrap css redefines the sizes of the html table.
Please, check if you’ve defined the sizes of your html body. Also check your custom css.

#3

i have the same problem.

#4

Did you try the suggestion?: