ie dynamic rendering 'feature'

[gerry]

I was playing around with ajax control extenders and created a simple
FrameExtender.
Basically it takes a panel and puts it inside a div that includes other divs
arranged in a frame around the original panel - pretty standard stuff.
Only the target panel exists on the server , all other divs are created on
the client by the extender behaviour script. The extender created divs are
assigned css classes to get the desired layout & appearance.

Everything seemed to work very well until I tried adding multiple
Panels/Extenders to the page - in which case it seems that only the last
'frame' created is properly laid out. The problem being related to
background images not being constrained to their containers. Resizing the
browser window fixes the problem.
I tried different combinations of background image , color , repeat ,
position , overflow to no avail.

I am looking at this using IE7 , Firefox2 & Opera9 - IE is the only browser
in this group that has this problem, the other browsers display the page as
intended.

A complete bare essentials web project example of the problem is located at
http://dev2.gerzio.ca/webtest.zip

I think I am basically doing this correctly - FF/Opera seem to bear this
out, so I guess I am looking for a work around to get this working in IE.

Gerry

 

[gerry]

if anyone is interested, I came up with this :

// :: Common.js
// Add common scripts here. To consume the scripts on a control add
//
// [RequiredScript(typeof(CommonScripts))]
// public class SomeExtender : ...
//
// to the controls extender class declaration.

var _layoutPending = false;
function _forceLayout()
{
if (!_layoutPending )
{
_layoutPending=true;
window.setTimeout( _forceLayout2 , 0 );
}
}
function _forceLayout2()
{
Sys.UI.DomElement.addCssClass( document.body , "JuNkJuNkJuNk" );
Sys.UI.DomElement.removeCssClass( document.body , "JuNkJuNkJuNk" );
_layoutPending=false;
}
Sys.UI.ForceLayout = _forceLayout;

.....

// :: ExtenderBehavior.js

....

Extender.Behavior.prototype = {
initialize: function() {
Extender.Behavior.callBaseMethod(this, 'initialize');
.....
Sys.UI.ForceLayout();
},
...
}