Dojo TabContainer mit Styling in Internet Explorer

Question

Folgende Arbeiten in Firefox:

 
< div style="position:absolute;top:0px;margin-top:60px;bottom:0px;width:100%"> 
< div id="mainTabContainer" dojoType="dijit.layout.TabContainer" style="width:100%;height:100%"> 
{% for row in tabContent %} 
    < div id="{{row.0}}" dojoType="dijit.layout.ContentPane" title="{{row.1}}"> 
    {% include row.2 %} 
    < /div> 
{% endfor %} 
< /div> 
< /div> 

aber in das heißt, es wird nicht angezeigt. Wenn ich das CSS auf dem äußeren Teil heraushole, funktioniert es.

Ich versuchte auch nur

 
< div style="position:absolute;top:0px;margin-top:60px;bottom:0px;width:100%"> 
< div style="width:100%;height:100%"> 
asdf 
< /div> 
< /div> 

und das funktioniert gut. Weiß jemand, warum die CSS das Rendering des TabContainers durcheinander bringen würde? Oder gibt es einen besseren Weg, um sicherzustellen, dass der TabContainer nur den Platz des Fensters einnimmt (um zwei Scrollbars zu vermeiden - eine für den Container und eine für den Browser)? Vielen Dank.

Answer 1

Welche Version von IE? Geben Sie die folgende CSS-Regel ein: html, body {height: 100%; Breite: 100%; Rand: 0; Auffüllen: 0; }

Die andere Sache, die Sie tun könnten (obwohl es schwerfällig erscheinen mag), ist ein BorderContainer als oberstes Element und der TabContainer als region = "center" -Teil.

<div dojoType="dijit.layout.BorderContainer" style="width:100%;height:100%"> 
    <div dojoType="dijit.layout.ContentPane region="top" style="height:60px"> 
     ... 
    </div> 
    <div dojoType="dijit.layout.TabContainer region="center"> 
     ... 
    </div> 
</div> 

Ich bekenne, dass ich das nicht in IE als Uhr am Mac versuchen kann, aber habe viele dijit Layout getan in letzter Zeit und so etwas wie dies funktionieren soll.