Solution for many "display:none" bugs.

I see many bugs on these forums which relate to Grids being rendered inside divs or spans with the css style set to "display:none".

Examples include:
* Scrollbars not appearing or incorrect scrollbars set.
* Data not appearing correctly.
* Data rows not resizing correctly after column header resizing.
* Javascript errors in grid.js


Typically, users need to show and hide a Grid based on users' actions, or show and hide multiple Grids in pages under a set of Tabs.

All of these bugs can be solved by following a different methodology. Instead of setting the grid's display to "none", use positioning to place the grid off the left-hand side of the page.

<span style="position:relative;">
    <span id="grid_view" style="position:absolute; top:0px; left:-2000px;>
         <script>document.write(grid);</script>
    </span>
</span>

By initialising the Grid with "left:-2000px", it renders without any problems, and can be easily moved on and off the screen by changing it's css:

<script>
    document.getElementById('grid_view').style.left='0px';
</script>

With this method, there is no need to manually refresh the Grid or raise any events to get the Grid to display properly.

This also displays the Grid almost instantly with no delay waiting for the Grid to render - as it has already fully rendered offscreen.