Grid not responsive if it's a split grid and with enablueAutoWidth enabled

Suite and Optimus Suite 5
#1

Please see the sample html code below. grid.xml is from DHTMLX samples.

<!DOCTYPE html>
<!--pro-->
<html>
<head>
	<title>Grid in split mode</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
	<link rel="stylesheet" type="text/css" href="dhtmlx.css"/>
	<script src="dhtmlx.js"></script>
	
	<script>
		var myGrid;
		function doOnLoad(){
			myGrid = new dhtmlXGridObject('gridbox');
			myGrid.setImagePath("imgs/");
			myGrid.setHeader("Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
			myGrid.setInitWidths("80,150,120,80,80,80,80,300");
			myGrid.setColAlign("right,left,left,right,center,left,center,center");
			myGrid.setColTypes("dyn,ed,ed,price,ch,co,ra,ro");
			var combobox = myGrid.getCombo(5);
			combobox.put("1","1 Hour");
			combobox.put("12","12 Hours");
			combobox.put("24","24 Hours");
			combobox.put("48","2 days");
			combobox.put("168","1 week");
			combobox.put("pick","pick up");
			combobox.put("na","na");
			myGrid.setColSorting("int,str,str,int,str,str,str,date");
			/*
			enableAutoWidth crashes the page
			*/
			//myGrid.enableAutoWidth(true, 650, 650);
		    myGrid.enableAutoHeight(true);
		    
			myGrid.init();
			myGrid.splitAt(2);
			myGrid.load("grid.xml");
			
		}
		function doSerialize(){
			myGrid.setSerializationLevel(false,false,false);
			document.getElementById("alfa1").innerHTML=myGrid.serialize().replace(/\</g,"&lt;").replace(/\>/g,"&gt;").replace(/\&lt;row/g,"<br/>&lt;row");
		}
	</script>
</head>
<body onload="doOnLoad()">
	<h1>Grid in split mode</h1>
	<p>Using split mode allows you to have grid separated into two parts with independent horizontal scrolling.</p>
	<div id="gridbox" style="width:650px;height:350px;background-color:white;"></div>
	<br />
	<div><a href="#" onClick="myGrid.selectRow(this.nextSibling.value)">Select row</a><input id="" type="text" value="2"/></div>
	<div><a href="javascript:void(0)" onClick="myGrid.addRow((new Date()).valueOf(), ['new','new','new'], 2)">Add row</a></div>
	<div><a href="#" onClick="myGrid.deleteRow(myGrid.getSelectedId())">Delete selected row</a></div>
	<div><a href="#" onClick="doSerialize()">Serialize</a></div>
	<div><a href="#" onClick="myGrid.clearAll();">Clear all</a></div>
	<div><a href="#" onClick="myGrid.load('../common/grid.xml')">Load XML</a></div>
	<div><a href="#" onClick="myGrid.cells(myGrid.getSelectedId(),this.nextSibling.value).setValue('new value');">Cells : setValue for selected row, column index:</a><input id="" type="text" value="1"/></div>
	<div id="alfa1"></div>
</body>
</html>
#2

Please, note, that the split mode cannot be used together with the autoWidth mode, as the split mode is using in case you have the horizontal scrollbar, while autowidth mode is using to evade the horizontal scrollbar at all.