2012-01-09 14 views
0

問題:Telerik TopPaneで高さをautoに設定できません。私は230pxのデフォルトの高さの値で終わる。Telerik TopPane height auto?

コード:

<div id="ParentDivElement" style="height: 100%;"> 
     <telerik:RadSplitter ID="MainSplitter" runat="server" Height="100%" Width="100%" 
      Orientation="Horizontal" Skin="Outlook" BorderSize="0"> 
      <telerik:RadPane ID="TopPane" runat="server" Height="auto" MinHeight="0" MaxHeight="0" 
       Scrolling="none" BorderStyle="None" EnableAjaxSkinRendering="False" 
       EnableTheming="False"> 
       <!-- Place the content of the pane here --> 
       <div id="tcp_main"> 
        <div id="tcp_logo"> 
         <image src="images/test/logo.png" alt="logo" /> 
        </div> 
        <div id="tcp_text"> 
         <h1> Hello world </h1> 
        </div> 
       </div> 
      </telerik:RadPane> 
      <telerik:RadSplitBar ID="RadsplitbarTop" runat="server" EnableResize="False" /> 
      <telerik:RadPane ID="MainPane" runat="server" Scrolling="none" MinWidth="500"> 
       <telerik:RadSplitter ID="NestedSplitter" runat="server" Skin="Outlook" LiveResize="true"> 
        <telerik:RadPane ID="LeftPane" runat="server" Width="200" MinWidth="150" MaxWidth="400"> 
         <!-- Place the content of the pane here --> 
        </telerik:RadPane> 
        <telerik:RadSplitBar ID="VerticalSplitBar" runat="server" CollapseMode="Forward" /> 
        <telerik:RadPane ID="ContentPane" runat="server"> 
         <!-- Place the content of the pane here --> 
        </telerik:RadPane> 
       </telerik:RadSplitter> 
      </telerik:RadPane> 
     </telerik:RadSplitter> 
</div> 

条件:私はautoに高さプロパティを設定した場合、私は次のエラーを取得する:

Property value is not valid. 

と私が得る細部に私をクリックした場合:

'auto' cannot be parsed as a unit as there are no numeric values in it. Examples of valid unit strings are '1px' and '.5in'. 

質問: Telerikのコントロールで高さが自動的に認識されないようです。私は自動車で終わらなければならないか、それと同等の機能ですか?

注:私はcssで!importantを使用したくありません。

答えて

1

WebControl.Styleから継承されたRadPaneスタイルプロパティとしてheight属性を設定します。スタイル属性は、スタイルコレクションOnPreRenderに追加される個々のプロパティと同じにレンダリングされます。

<telerik:RadPane ID="TopPane" runat="server" 
      Scrolling="none" BorderStyle="None" EnableAjaxSkinRendering="False" 
      EnableTheming="False" Style="height: auto; min-height: 0px;"> 
+0

これは機能しません。高さが設定され、javascriptでウィンドウサイズを変更すると、高さが調整されます。しかし、高さはcss autoで設定されていないので、機能は異なります。私はcssに "auto"と同じ機能を持たせたいと思っています。 – NomenNescio

+0

カスタムJavaScriptを実装しない限り、SplitterPaneが自動的に移動されるのと同じ効果は得られません。私が示唆したことは、オーバーフロープロパティをスクロールするように設定してdiv展開が表示されるように動作することです。 – Lloyd

+0

私はsplitterpaneを自動的に動かしても構いません。幅を "width:auto;"に設定したい – NomenNescio

1

私はCSSで重要!あなたに何を設定したくない言及したことを知っているが、実験のために、あなたは以下のことを試してみましたか?

CSS:

<style type="text/css"> 
    .AutoHeight 
    { 
     height: auto !important; 
    } 
</style> 

マークアップ:

<telerik:RadPane ID="TopPane" runat="server" ... CssClass="AutoHeight" ...> 

これは、自動する高さを強制すべきです。これがうまくいくなら、更新された高さ属性で使用しているTelerikスキン(Outlook)を修正することができます。これをスキンで更新すると、重要な設定は必要ありません。

RadSplitterコントロールはRadPaneの特定のサイズセット(最小/最大の高さ/幅など)を使用しているため、通常の<div>要素「トップパネル」として使用し、下半分にのみRadSplitterを使用します。