This is a migrated thread and some comments may be shown as answers.

IE6 problem with height

3 Answers 85 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
Reiner
Top achievements
Rank 1
Reiner asked on 20 Jan 2009, 08:13 AM
Hello,

i have a problem in IE6 with the splitter control. It works in IE7 sucessfull.
If the Content is bigger as the resolution of the window then you can scroll down but the splitter control don't show anything.

<html xmlns="http://www.w3.org/1999/xhtml" style="height:100%;margin:0px;" > 
<head runat="server"
    <title>Car-I Solutions</title> 
    <link rel="stylesheet" type="text/css" href="Styles/cari.css" /> 
</head> 
<body style="height:100%;margin:0px;"
    <script language="javascript"
            function UpdateCustomizationWindowValue() { 
    var element = document.getElementById("btnCustWindow"); 
    if(element == null) return; 
    element.value = (grid.IsCustomizationWindowVisible() ? "Schliesse" : "Zeige") + " Bearbeitungsfenster"; 
function ShowHideCustomizationWindow() { 
    if(grid.IsCustomizationWindowVisible()) 
        grid.HideCustomizationWindow(); 
    else grid.ShowCustomizationWindow();         
    UpdateCustomizationWindowValue(); 
        </script> 
        <script language="javascript" type="text/javascript"><!-- 
    // <!CDATA[ 
    function OnMoreInfoClick(element, keyValue) { 
        fzpopup.SetContentUrl('common/controllloader.aspx?control=fzdetail.ascx&fz_id=' + keyValue); 
        fzpopup.Show(); 
    } 
    //--></script
    <form id="form1" runat="server" style="height:100%;margin:0px;"
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"></telerik:RadAjaxManager> 
        <telerik:RadScriptManager id="RadScriptManager1" Runat="server" AsyncPostBackTimeout="600"
        </telerik:RadScriptManager> 
    <div style="height:100%;margin:0px;"
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" HorizontalAlign="NotSet" LoadingPanelID="RadAjaxLoadingPanel1" UpdateMode="Conditional"
        <telerik:RadToolBar id="RadToolBar1" Runat="server" OnButtonClick="RadToolBar1_ButtonClick" 
            Skin="Office2007" style="width:100%"
            <Items>                 
                <telerik:RadToolBarButton runat="server" Text="Home"
                    <ItemTemplate> 
                        &nbsp;&nbsp;<asp:ImageButton runat="server" ID="btn_home" ImageUrl="~/images/Home16.png" OnClick="btn_home_Click" />&nbsp;&nbsp; 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" Text="Search"
                    <ItemTemplate> 
                        <asp:Panel runat="server" ID="pan_search" DefaultButton="btn_search"
                            &nbsp; 
                            <telerik:RadTextBox ID="tb_search" runat="server"
                            </telerik:RadTextBox>&nbsp; 
                            <asp:ImageButton runat="server" ID="btn_search" ImageUrl="~/images/Search16.png" OnClick="btn_search_Click" />&nbsp;&nbsp; 
                        </asp:Panel> 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" Text="LogInfo"
                    <ItemTemplate> 
                        <asp:LoginName ID="LoginName1" runat="server" />&nbsp; 
                        <asp:LoginStatus ID="LoginStatus1" runat="server" /> 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
            </Items> 
            <CollapseAnimation Duration="200" Type="OutQuint" /> 
        </telerik:RadToolBar> 
        <telerik:RadSplitter ID="RadSplitter1" runat="server" Skin="Office2007" Width="100%" Height="100%" SplitBarsSize="">             
            <telerik:RadPane ID="splitpan_menue" runat="server" Height="100%" Width="200" Scrolling="None" >                 
                        <telerik:RadPanelBar ID="RadPanelBar_Funktionen" runat="server" PersistStateInCookie="True" Skin="WebBlue" Width="195px"
                            <Items> 
                                <telerik:RadPanelItem Text="Auswertungen" runat="server" Expanded="True"
                                    <Items> 
                                        <telerik:RadPanelItem runat="server"
                                            <ItemTemplate> 
                                                <telerik:RadTreeView ID="tv_auswertungen" runat="server" Skin="Office2007" OnNodeClick="NodeClick"
                                                    <Nodes> 
                                                        <telerik:RadTreeNode Text="Bestand" Expanded="True" Checkable="False" ExpandMode="ClientSide"
                                                            <Nodes> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestandsliste" Value="reports/bestand_liste.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestand Ãœbersicht" Value="reports/rep_bestanduebersicht.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestands Auswertungen" Value="reports/rep_bestand_standtaggruppe.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestandsentwicklung" Value="webparts/wp_gwbestandentwicklung.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestands Bewertung" Value="reports/dispo/rep_bestandsbewertung.ascx"></telerik:RadTreeNode> 
                                                            </Nodes> 
                                                        </telerik:RadTreeNode> 
                                                        <telerik:RadTreeNode Text="Verkauf" Expanded="True" Checkable="False" ExpandMode="ClientSide"
                                                            <Nodes> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungsliste" Value="reports/rep_auslieferungsliste.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungsübersicht" Value="reports/rep_ausluebersicht.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungs Auswertungen" Value="reports/rep_ausliefer_auswertungen.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Verkauf nach Verkäufer" Value="reports/rep_auslverkaeufer.ascx"></telerik:RadTreeNode> 
                                                            </Nodes> 
                                                        </telerik:RadTreeNode> 
                                                    </Nodes> 
                                                </telerik:RadTreeView> 
                                            </ItemTemplate> 
                                        </telerik:RadPanelItem> 
                                    </Items> 
                                     
                                </telerik:RadPanelItem> 
                            </Items> 
                            <CollapseAnimation Duration="100" Type="None" /> 
                            <ExpandAnimation Duration="100" Type="None" /> 
                        </telerik:RadPanelBar> 
            </telerik:RadPane> 
            <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="Forward" Height="100%" /> 
            <telerik:RadPane ID="splitpan_content" runat="server" Scrolling="None" Height="100%" Width="100%"
                <telerik:RadAjaxLoadingPanel id="RadAjaxLoadingPanel1" Runat="server" height="75px" 
                    HorizontalAlign="Center" width="75px" MinDisplayTime="20" Transparency="30"
                    <img alt="wird aktualisiert" src="App_Themes/Aqua/GridView/Loading.gif" style="border: 0px;" /> 
                </telerik:RadAjaxLoadingPanel> 
                <asp:Panel ID="pan_content" runat="server" Height="100%" Width="100%" style="margin:3px;"
                    </asp:Panel> 
            </telerik:RadPane> 
        </telerik:RadSplitter> 
        </telerik:RadAjaxPanel> 
    </div> 
    </form> 
</body> 
</html> 

can you understand me? can you help me?

Thank you very much.

Regards
Reiner


3 Answers, 1 is accepted

Sort by
0
Reiner
Top achievements
Rank 1
answered on 20 Jan 2009, 08:21 AM
It looks like

Screenshot
0
Reiner
Top achievements
Rank 1
answered on 20 Jan 2009, 08:51 AM
sorry i have paste the false code, that's the right:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml" style="margin:0px;" > 
<head id="Head1" runat="server"
    <title>Car-I Solutions</title> 
    <link rel="stylesheet" type="text/css" href="Styles/cari.css" /> 
</head> 
<body style="height:100%;margin:0px;"
    <script language="javascript"
            function UpdateCustomizationWindowValue() { 
    var element = document.getElementById("btnCustWindow"); 
    if(element == null) return; 
    element.value = (grid.IsCustomizationWindowVisible() ? "Schliesse" : "Zeige") + " Bearbeitungsfenster"; 
function ShowHideCustomizationWindow() { 
    if(grid.IsCustomizationWindowVisible()) 
        grid.HideCustomizationWindow(); 
    else grid.ShowCustomizationWindow();         
    UpdateCustomizationWindowValue(); 
        </script> 
        <script language="javascript" type="text/javascript"><!-- 
    // <!CDATA[ 
    function OnMoreInfoClick(element, keyValue) { 
        fzpopup.SetContentUrl('common/controllloader.aspx?control=fzdetail.ascx&fz_id=' + keyValue); 
        fzpopup.Show(); 
    } 
    //--></script
    <form id="form1" runat="server" style="height:100%;margin:0px;"
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"></telerik:RadAjaxManager> 
        <telerik:RadScriptManager id="RadScriptManager1" Runat="server" AsyncPostBackTimeout="600"
        </telerik:RadScriptManager> 
    <div style="height:100%;margin:0px;"
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" HorizontalAlign="NotSet" LoadingPanelID="RadAjaxLoadingPanel1" UpdateMode="Conditional"
        <telerik:RadToolBar id="RadToolBar1" Runat="server" OnButtonClick="RadToolBar1_ButtonClick" 
            Skin="Office2007" style="width:100%"
            <Items>                 
                <telerik:RadToolBarButton runat="server" Text="Home"
                    <ItemTemplate> 
                        &nbsp;&nbsp;<asp:ImageButton runat="server" ID="btn_home" ImageUrl="~/images/Home16.png" OnClick="btn_home_Click" />&nbsp;&nbsp; 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" Text="Search"
                    <ItemTemplate> 
                        <asp:Panel runat="server" ID="pan_search" DefaultButton="btn_search"
                            &nbsp; 
                            <telerik:RadTextBox ID="tb_search" runat="server"
                            </telerik:RadTextBox>&nbsp; 
                            <asp:ImageButton runat="server" ID="btn_search" ImageUrl="~/images/Search16.png" OnClick="btn_search_Click" />&nbsp;&nbsp; 
                        </asp:Panel> 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
                <telerik:RadToolBarButton runat="server" Text="LogInfo"
                    <ItemTemplate> 
                        <asp:LoginName ID="LoginName1" runat="server" />&nbsp; 
                        <asp:LoginStatus ID="LoginStatus1" runat="server" /> 
                    </ItemTemplate> 
                </telerik:RadToolBarButton> 
            </Items> 
            <CollapseAnimation Duration="200" Type="OutQuint" /> 
        </telerik:RadToolBar> 
        <telerik:RadSplitter ID="RadSplitter1" runat="server" Skin="Office2007" Width="100%" Height="95%" SplitBarsSize="">             
            <telerik:RadPane ID="splitpan_menue" runat="server" Height="95%" Width="200" Scrolling="None" >                 
                        <telerik:RadPanelBar ID="RadPanelBar_Funktionen" runat="server" PersistStateInCookie="True" Skin="WebBlue" Width="195px"
                            <Items> 
                                <telerik:RadPanelItem Text="Auswertungen" runat="server" Expanded="True"
                                    <Items> 
                                        <telerik:RadPanelItem runat="server"
                                            <ItemTemplate> 
                                                <telerik:RadTreeView ID="tv_auswertungen" runat="server" Skin="Office2007" OnNodeClick="NodeClick"
                                                    <Nodes> 
                                                        <telerik:RadTreeNode Text="Bestand" Expanded="True" Checkable="False" ExpandMode="ClientSide"
                                                            <Nodes> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestandsliste" Value="reports/bestand_liste.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestand Ãœbersicht" Value="reports/rep_bestanduebersicht.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestands Auswertungen" Value="reports/rep_bestand_standtaggruppe.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestandsentwicklung" Value="webparts/wp_gwbestandentwicklung.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Bestands Bewertung" Value="reports/dispo/rep_bestandsbewertung.ascx"></telerik:RadTreeNode> 
                                                            </Nodes> 
                                                        </telerik:RadTreeNode> 
                                                        <telerik:RadTreeNode Text="Verkauf" Expanded="True" Checkable="False" ExpandMode="ClientSide"
                                                            <Nodes> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungsliste" Value="reports/rep_auslieferungsliste.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungsübersicht" Value="reports/rep_ausluebersicht.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Auslieferungs Auswertungen" Value="reports/rep_ausliefer_auswertungen.ascx"></telerik:RadTreeNode> 
                                                                <telerik:RadTreeNode runat="server" Text="Verkauf nach Verkäufer" Value="reports/rep_auslverkaeufer.ascx"></telerik:RadTreeNode> 
                                                            </Nodes> 
                                                        </telerik:RadTreeNode> 
                                                    </Nodes> 
                                                </telerik:RadTreeView> 
                                            </ItemTemplate> 
                                        </telerik:RadPanelItem> 
                                    </Items> 
                                     
                                </telerik:RadPanelItem> 
                            </Items> 
                            <CollapseAnimation Duration="100" Type="None" /> 
                            <ExpandAnimation Duration="100" Type="None" /> 
                        </telerik:RadPanelBar> 
            </telerik:RadPane> 
            <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="Forward" /> 
            <telerik:RadPane ID="splitpan_content" runat="server" Scrolling="None"
                <telerik:RadAjaxLoadingPanel id="RadAjaxLoadingPanel1" Runat="server" height="75px" 
                    HorizontalAlign="Center" width="75px" MinDisplayTime="20" Transparency="30"
                    <img alt="wird aktualisiert" src="App_Themes/Aqua/GridView/Loading.gif" style="border: 0px;" /> 
                </telerik:RadAjaxLoadingPanel> 
                <asp:Panel ID="pan_content" runat="server" Height="90%" Width="799" style="margin:3px;"
                    </asp:Panel> 
            </telerik:RadPane> 
        </telerik:RadSplitter> 
        </telerik:RadAjaxPanel> 
    </div> 
    </form> 
</body> 
</html> 
 

0
Svetlina Anati
Telerik team
answered on 21 Jan 2009, 04:14 PM
Hello Reiner,

I prepared a test demo based on your code but I was not able to reproduce the problem under IE6. What I noticed concerning the height is that you have set the RadSplitter's size in percentages and at the same time you have not set all its parents' height explicitly, too, e.g the HTML and the RadAjaxPanel does not have any height set.

This being said, I suggest to modify your code as shown below:

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<html xmlns="http://www.w3.org/1999/xhtml"
<head id="Head1" runat="server"
    <title>Car-I Solutions</title> 
    <link rel="stylesheet" type="text/css" href="Styles/cari.css" /> 
    <style type="text/css"
    html, body, form 
    { 
       height: 100%; 
       margin: 0; 
       padding: 0;  
       overflow: hidden;     
    } 
     
    </style> 
</head> 
<body> 
 
    <script language="javascript">  
            function UpdateCustomizationWindowValue() {  
    var element = document.getElementById("btnCustWindow");  
    if(element == null) return;  
    element.value = (grid.IsCustomizationWindowVisible() ? "Schliesse" : "Zeige") + " Bearbeitungsfenster";  
}  
function ShowHideCustomizationWindow() {  
    if(grid.IsCustomizationWindowVisible())  
        grid.HideCustomizationWindow();  
    else grid.ShowCustomizationWindow();          
    UpdateCustomizationWindowValue();  
}  
    </script> 
 
    <script language="javascript" type="text/javascript"><!--  
    // <!CDATA[  
    function OnMoreInfoClick(element, keyValue) {  
        fzpopup.SetContentUrl('common/controllloader.aspx?control=fzdetail.ascx&fz_id=' + keyValue);  
        fzpopup.Show();  
    }  
    //--></script
 
    <form id="form1" runat="server"
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1"
        </telerik:RadAjaxManager> 
        <telerik:RadScriptManager id="RadScriptManager1" Runat="server" AsyncPostBackTimeout="600"
        </telerik:RadScriptManager> 
        <div style="height: 100%; margin: 0px;border: 0;"
            <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" HorizontalAlign="NotSet" 
                LoadingPanelID="RadAjaxLoadingPanel1" UpdateMode="Conditional" Height=100%> 
                <telerik:RadToolBar id="RadToolBar1" Runat="server" 
                    Skin="Office2007" style="width: 100%"
                    <items>                  
                <telerik:RadToolBarButton runat="server" Text="Home">  

For your convenience I attached my test page along with a screenshot of the appearance on my side. In case you need further assistance, please modify the page, open a new support ticket and send it to me along with some screenshots and confirmation that the version you use is the latest one, 2008.3 1314, as noted in this thread .

Greetings,
Svetlina
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Splitter
Asked by
Reiner
Top achievements
Rank 1
Answers by
Reiner
Top achievements
Rank 1
Svetlina Anati
Telerik team
Share this question
or