The header row is appearing narrower than the rest of the grid (see attached image).  It acts the same in IE11, Firefox 32, and Chrome 37.

I am using an igGrid inside a tile using the tileLayoutManager.  It isn't overly complicated, but I am apparently messing it up somehow...am I missing an option?

<div id='tileChartGrid1'></div>

var aoData = [{"Name":"Availability","Value":1147.4},{"Name":"Operating","Value":122.7},{"Name":"Mechanical","Value":0},{"Name":"Electrical","Value":0},{"Name":"Automation","Value":5.6},{"Name":"Upstream / Scheduling","Value":0.0},{"Name":"Finishing","Value":164.3},{"Name":"Shipping","Value":0},{"Name":"Quality","Value":0}];

$('#tileChartGrid1').igGrid({height: "100%", autoGenerateColumns: false, datasource: aoData, columns: [{ headerText: "Name", key: "Name", dataType: "string" },{ headerText: "Value", key: "Value", dataType: "number" }]});

Looking at it thru developer tools reveals a couple of things (see attached screen shots) I can see that the div it creates to contain the header has "overflow: hidden" as an inline style.  If I disable that, then the header appears properly, but often the columns do not align with the columns in the rest of the grid.