Thanks for the quick response. You all provide really great support!
The IsResponsive and MinWidth helped when the grid was resized narrower. However, if the area where the grid is made wider then it won't resize past it's original width.
I created the following in the JS Playground which showed the problem (after the grid initially displays try making the area where the grid wider - the grid does not change width):
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Essential Studio for JavaScript">
<meta name="author" content="Syncfusion">
<title>Untitled</title>
<!-- Essential Studio for JavaScript theme reference -->
<link rel="stylesheet" rel='nofollow' href="http://cdn.syncfusion.com/14.2.0.26/js/web/flat-azure/ej.web.all.min.css" />
<!-- Essential Studio for JavaScript script references -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js"> </script>
<script src="http://cdn.syncfusion.com/js/assets/external/jquery.globalize.min.js"></script>
<script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></script>
<script src="http://cdn.syncfusion.com/14.2.0.26/js/web/ej.web.all.min.js"> </script>
<!--Add custom scripts here -->
</head>
<body>
<div style="padding:10px">
<h2>Welcome to Syncfusion Essential JavaScript Playground</h2>
</div>
<script>
$("#Grid").ejGrid({
// dataSource: data,
allowFiltering: true,
allowPaging: true,
allowSorting: true,
allowTextWrap: true,
allowResizeToFit: true,
isResponsive: true,
minWidth: 400,
filterSettings: { filterType: "excel" },
columns: [
{ field: "OrderID", headerText: "Order ID", textAlign: ej.TextAlign.Right},
{ field: "CustomerID", headerText: "Customer ID" },
{ field: "EmployeeID", headerText: "Employee ID", textAlign: ej.TextAlign.Right },
{ field: "Freight", format: "{0:C}", textAlign: ej.TextAlign.Right },
{ field: "OrderDate", headerText: "Order Date", format: "{0:MM/dd/yyyy}", textAlign: ej.TextAlign.Right },
{ field: "ShipCity", headerText: "Ship City"},
{ field: "field1", headerText: "field1" },
{ field: "field2", headerText: "field2" },
{ field: "field3", headerText: "field3" },
{ field: "field4", headerText: "field4" },
{ field: "field5", headerText: "field5" }
]
});
</script>
</body>
</html>
