Internet Explorer에서 스타일이있는 Dojo Tabcontainer

Question

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>

그러나 즉, 표시되지 않습니다. 외부 div에서 CSS를 꺼내면 작동합니다.

나는 또한 그냥 시도했다

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

그리고 그것은 잘 작동합니다. CSS가 왜 Tabcontainer의 렌더링을 엉망으로 만들지 아는 사람이 있습니까? 아니면 TabContainer가 창의 공간 만 차지하는지 확인하는 더 좋은 방법이 있습니까 (컨테이너와 브라우저 용으로 하나의 스크롤 바를 갖지 않도록)? 감사.

Answer 1

IE의 어떤 버전?

다음 CSS 규칙을 추가 해보십시오 : HTML, BODY {높이 : 100%; 너비 : 100%; 여백 : 0; 패딩 : 0; }

당신이 할 수있는 또 다른 일은 (손이 무거운 것처럼 보일지 모르지만) BorderContainer를 최상위 요소로 가지고 있고 Tabcontainer를 region = "Center"부분으로 갖는 것입니다.

<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>

나는 Mac에있는 것처럼 IE에서 이것을 시도 할 수 없다고 고백하지만 최근에 많은 Dijit 레이아웃을 해왔으며 이와 같은 것이 효과가 있어야합니다.