Dojo tabContainer を使用しています。簡単な質問: Dojo コンテナーを扱っている場合、CSS でウィジェットのサイズをピクセル単位で指定する必要がありますか? 私が見ていることから、TabContainer を実際に表示する唯一の方法は、CSS を介して絶対サイズを指定することです。
更新:要素bodyと属性htmlが欠落していることがわかったheightため、0 に計算されました。したがって、それらを 100% に設定すると、フォームが表示されます...しかし、それは巨大になります! （ページがある限り）。アイデアは、高さを に設定してauto、「必要な限り」にすることです...それは可能ですか?
私のHTMLには次のようなものがあります：
...
<body>
<div id="loginForm"> </div>
</body>
...
次に、コードに次のように記述します。
require(["app/widgets/LoginForm"], function( loginForm){
// Create the "application" object, and places them in the right spot.
loginForm = new LoginForm( {} , 'loginForm');
loginForm.startup();
});
LoginForm は、次のテンプレートを使用した単純なテンプレート ベースのウィジェットです。
<div data-dojo-attach-point="tabContainer" data-dojo-type="app.TabFading" data-dojo-props="tabPosition:'top'" style="height:100%">
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-attach-point="loginPane" data-dojo-props="title: 'Login'">
<form data-dojo-type="dijit.form.Form" data-dojo-attach-point="loginForm" method="POST">
<label for="${id}_login">Login</label>
<input name="login" id="${id}_login" data-dojo-attach-point="login" data-dojo-type="dijit.form.ValidationTextBox" data-dojo-props="required:true"/>
<label for="${id}_password">Password</label>
<input name="password" id="${id}_password0" data-dojo-attach-point="password" data-dojo-type="app.ValidationPassword" />
<input type="submit" data-dojo-attach-point="button" data-dojo-type="app.BusyButton" label="Login!" />
</form>
</div>
</div>
</div>
CSS は基本的なものです。
#loginForm {
width: 300px;
margin: 0 auto;
padding: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
/*** Background Gradient - 2 declarations one for Firefox and one for Webkit ***/
background: -moz-linear-gradient(19% 75% 90deg,#FCFCFC, #CCCCCC);
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FCFCFC), to(#CCCCCC));
/*** Shadow behind the box ***/
-moz-box-shadow:0px -5px 300px #a9a0a0;
-webkit-box-shadow:0px -5px 300px #a9a0a0;
}
body {
background-color: #fcfcfc;
font: 9pt/1.5em Helvetica Neue, Helvetica, Arial, sans-serif;
margin: 0 0;
}
TabContainer を実際に表示する唯一の方法は、TabContainer を含めることheight:300pxです。それ以外の場合、計算された高さは 0 です。
これが意図された方法ですか？それとも私は何か間違ったことをしていますか？