Tabs and Layout / Problems with IE

[cmu4955]

Probably a misunderstanding on my side, but I can't figure out how to
get the following page to work properly in IE7:
http://www.opencrx.org/_gui/m.html

Apart from the suggested scroll="no" the page seems to validate at
http://validator.w3.org and the page works as expected with FF 1.5/2.0
and Opera 9.10.

With IE, however, the tabs and their contents seem to be positioned
staticly, i.e. scrolling the content region does not move the tabs
and their contents. To observe the issue, make the browser window
kind of small (e.g. 300px x 600px) and click on the tab "System".
The blue and red borders are just there to highlight the issue.

This example page uses yui_0.12.1 and yui-ext.0.33-rc3
(but the same issue exists with yui 0.12.0 and yui-ext.0.33-rc2).

Any ideas/suggestions are appreciated (and thanks to Jack for a
great library).

-Chris

[tryanDLS]

Try and upgrade to the real .33 release - there were some fixes in there and there's no point trying to debug against the older codebase

[cmu4955]

Thanks Tim - unfortunately, the same issue persists with yui-ext.0.33

The page http://www.opencrx.org/_gui/m.html now uses
yui_0.12.1 and yui-ext.0.33.

[jack.slocum]

This thread has more details:

http://www.yui-ext.com/forum/viewtopic.php?t=1143

It's a serious bug in IE7 that only pops up in strict mode.

You can try adding "position:relative" to your tab container element "inspector". If that does't work try this in script:

tabs.bodyEl.setStyle('position', 'relative');

The best solution though is to use BorderLayouts built in tabs which will fix this for you.

[cmu4955]

Thx for the confirmation (of the IE bug) and the helpful links.

It looks like I got a handle on the issue with a conditional comment (basically selecting a different doctype for IE); the layout and the tabs are now working fine with Opera, FF, and IE.

We will do some more testing but the odds are that we will start using yui-ext for openCRX...