jQuery Layout

Reference: http://layout.jquery-dev.net/

HTML

<script src="http://layout.jquery-dev.net/lib/js/jquery.layout-latest.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://trirand.com/blog/jqgrid/themes/ui.jqgrid.css">
<script src="http://trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
<script src="http://trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js"></script>
<div id="content">
    <div class="ui-layout-center">
        <div id="grid-content">
            <table id="grid"></table>
        </div>
    </div>
    <div class="ui-layout-west">West</div>
</div>

CSS

#content {
    height:400px;
}

JavaScript

$("#grid").jqGrid({
    datatype: "local",
    height: 330,
    colNames: ['Key', 'Value'],
    colModel: [{
        name: 'Key',
        index: 'Key'
    }, {
        name: 'Value',
        index: 'Value'
    }]
});

$('#content').layout({
    applyDefaultStyles: true
});