Infragistics UltraWebGrid - ASP.Net - Grids position fixed and are not scrolling with page

I have two grids on a page that seem to always be position:fixed.

I want them to scroll with the page开发者_开发百科 when an overflow scrollbar appears on the body. The grids however ALWAYS stay in the same place and don't scroll with the rest of the page content.

Is there any way to get an UltraWebGrid to be relative and scroll up the page with the rest of the page's content?

This seems to work in IE6 but not in IE8. All jQuery/CSS hacks haven't been successful.

Very similar issue(s) and related reference links that may be helpful for any who also land here:

This one cracked it for me, changed my head to runat=server and magically the overflow and scrolling are working again. This is not a good practice, but a work-around. This is because

“…. The page’s controls collection is created differently if the page has inline expressions. In a page without inline expressions, the first element in the controls collection is a Literal control that has all of the html between the top of the page and the first server control. When there’s an inline expression, the first element in the controls collection is the first server control on the page (usually the element or the ).

The grid needs the literal with all that markup to figure out what doctype the grid has because it needs to render slightly differently depending if the page is in quirks mode or standards mode. One of the big differences is it adds a “position:relative” style to the scrolling area to prevent the problem with the rows spilling out of the grid.

The way to fix it is to move the inline code to the code behind. Use the Page.ClientScript.RegisterClientScriptBlock method to generate the javascript based on the Request.Params["expired"] value. ……”

http://wagnerblog.com/2007/09/creative-terminology-and-an-infragistics-ultrawebgrid-bug/

This one didn't seem to help me, but ymmv

http://blogs.infragistics.com/forums/p/21880/79596.aspx :

The grid uses relative positioning. Its containers should have position:relative as well so the grid does not stick out.

Just in case it could be useful for anyone. I found that, for some reason, every single object in the table created by the component has the attribute "position: relative". When you remove it, the table behaves as it should.

Thus I've written this code to remove this attribute. I copied and paste the name of the table created by Infragistics, so change it (or find a better way to get it ^^)

function removeRelativePosition(item) {
    var elt;
    if(item == '') {
        elt = document.getElementById('ctl00xmasterContentPlaceHolderxwPanReportsxuwGridReport_main');
    }
    else {
        elt = item;
    }

    //Call this function recursively on every child
    if(elt.childNodes !== undefined) {
        for(var i=0;i< elt.childNodes.length; i++) {
            removeRelativePosition(elt.childNodes[i]);
        }
    }
    //Then remove the attribute
    if(elt.style !== undefined) {
        elt.style.position = '';
    }
}

//Run this function when your page is ready
$(document).ready(function() {
    removeRelativePosition('');
});