在 Internet Explorer 中具有样式的 Dojo TabContainer

发布于 2024-07-29 03:27:38 字数 791 浏览 2 评论 0原文

以下内容在 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>

但在 ie 中不显示。当我取出外部 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 会扰乱 ie 中 TabContainer 的渲染？或者是否有更好的方法来确保 TabContainer 只占用窗口空间（以防止有两个滚动条 - 一个用于容器，一个用于浏览器）？谢谢。

原文

The following works 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>

but in i.e. it doesn't display. When I take out the css on the outer div, it works.

I also tried just

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

and that works fine. Does anyone know why the css would mess up rendering of the TabContainer in i.e.? Or is there a better way to make sure the TabContainer only takes up the space of the window (to prevent having two scrollbars--one for the container and one for the browser)? Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

╰沐子 2024-08-05 03:27:38

什么版本的IE？

尝试添加以下 CSS 规则：
html, 正文 { 高度: 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 布局，这样的东西应该可以工作。

What version of IE?

Try adding the following CSS rule:
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }

The other thing you could do (though it might seem heavy-handed) is have a BorderContainer as your top-level element and have the TabContainer as the region="center" part.

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

I confess I can't try this in IE as am on Mac but have been doing loads of dijit layout lately and something like this should work.

回复收藏 0 原文

~没有更多了~