I know this question is old, but the reply is a clunky and slow.

Here’s a CSS approach:

http://jsfiddle.net/Ba5yK/11/

Add this to the grid definition (change the name of gridName to that of your grid)

beforeRequest: function () {
  setTimeout(function () {
    var gridName = ‘grid’;
    $(‘#gbox_’ + gridName).css({
      position: ‘absolute’,
      top: 0,
      bottom: $(‘#gbox_’ + gridName + ‘ .ui-pager-control’).outerHeight() + ‘px’,
      width: ‘100%’,
      height: ‘100%’
    });
    $(‘#gbox_’ + gridName + ‘ .ui-jqgrid-view’).css({ ‘height’: ‘100%’ });

    $(‘#gbox_’ + gridName + ‘ .ui-jqgrid-bdiv’).css({
      position: ‘absolute’,
      top: $(‘#gbox_’ + gridName + ‘ .ui-jqgrid-titlebar’).outerHeight() + $(‘#gbox_’ + gridName + ‘ .ui-jqgrid-hbox’).outerHeight() + ‘px’,
      bottom: 0,
      left: 0,
      right: 0,
      height: ”,
      width: ”
    });

  }, 100);
}

Glad to help

The problem you mention is the ‘Loading’ sign not going away – that was just to do with the missing grid.locale-en.js.

*Edit – just spotted I had the wrong sort type on the ‘thingy’ column.

It wasn’t related to the resizing.  Here’s a new link:

http://jsfiddle.net/Ba5yK/16/

I’m using this CSS injection on dozens of grids and all work perfectly.

Regards

 

Paul