Javascript 如何设置Dojo标题板相对于外部容器节点大小的高度？

在下一个示例中，我在一个200像素高的容器之间创建了一个标题栏。我将标题板高度设置为100%，但它似乎没有扩展

相关代码：

var titlePane = new TitlePane({
    title: "TITLE",
    toggleable: false,
    style: "height: 100%; overflow-y: auto",
    content: "foo"
});
var outerPane = new ContentPane({
    content: titlePane,
    style: "height: 200px;"
}, dojo.byId("body2"));

完整示例：

有什么想法吗？

添加这种样式

.dijitTitlePaneContentOuter 
{
    height:80%;   
}

我不确定这是不是最好的选择。但这也是工作

---

我发现了一个使用accordion容器的解决方案。当只包含一个带有标题的窗格时，它看起来几乎相同

function example(ContentPane, Accordion, Button){

var titlePane = new Accordion({
       style: "height: 100%; overflow-y: auto"
     });

var innerPane = new ContentPane({title:'TITLE', content:'foo'})

titlePane.addChild(innerPane);

var outerPane= new ContentPane({
    content:titlePane,
    style: "height: 200px;"
}, dojo.byId("body2"));

outerPane.startup()
var button= new Button({
    label:"add line",
    onClick:function(ev){
        innerPane.set("content", innerPane.get("content")+"<br>foo")
    }    
}).placeAt(dojo.byId("body2"), "after");
}

require(["dijit/layout/ContentPane", "dijit/layout/AccordionContainer",
     "dijit/form/Button"], example );

功能示例（内容窗格、手风琴、按钮）{
var titlePane=新手风琴({
样式：“高度：100%；溢出-y:自动”
});
var innerPane=newcontentpane（{title:'title'，content:'foo'}）
titlePane.addChild（内部窗格）；
var outerPane=新内容窗格({
内容：titlePane，
样式：“高度：200px
}，dojo.byId（“body2”）；
outerPane.startup（）
var按钮=新按钮({
标签：“添加行”，
onClick：功能（ev）{
innerPane.set（“内容”，innerPane.get（“内容”）+“
foo”）
}    
}).placeAt（dojo.byId（“body2”），“之后”）；
}
要求（[“dijit/layout/ContentPane”、“dijit/layout/AccordionContainer”，
“dijit/form/Button”]，示例）；