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

[Solved] RadDockZone MinHeight

2 Answers 142 Views

Dock

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

stevenbright asked on 17 Jul 2007, 10:37 PM

I have a page layout using a table with 4 docking zones and a width of 100%. There is one row across the top that spans 3 columns and contains one zone, then there are 3 columns on the second row, each containing a zone. Whenever this code is executed with a minHeight value set, it shows up as a completely flat table with no height outside of the radDockZone borders. Any ideas as to why this is occurring?

            <telerik:raddocklayout runat="server" id="RadDockLayout1" onsavedocklayout="DockLayout_SaveDockLayout" onloaddocklayout="DockLayout_LoadDockLayout">  

            <table id="WebPartLayoutTable" cellpadding="0" cellspacing="0">  

                <tr> 

                    <td colspan="3">  

                        <telerik:RadDockZone ID="Zone1" runat="server" MinHeight="250px" Width="100%" /> 

                    </td> 

                </tr> 

                <tr> 

                    <td> 

                        <telerik:RadDockZone ID="Zone2" runat="server" MinHeight="250px" Width="100%" /> 

                    </td> 

                    <td> 

                        <telerik:RadDockZone ID="Zone3" runat="server" MinHeight="250px" Width="100%" /> 

                    </td> 

                    <td> 

                        <telerik:RadDockZone ID="Zone4" runat="server" MinHeight="250px" Width="100%" /> 

                    </td> 

                </tr> 

            </table> 

            <div style="display:none">  

                Hidden UpdatePanel, which is used to receive the new dock controls.   

                We will move them with script to the desired initial dock zone.  

                <asp:updatepanel runat="server" id="UpdatePanel1">  

                    <triggers> 

                        <asp:asyncpostbacktrigger controlid="ButtonAddDock" eventname="Click" /> 

                    </triggers> 

                </asp:updatepanel> 

            </div> 

       </telerik:raddocklayout>

2 Answers, 1 is accepted

answered on 18 Jul 2007, 12:26 PM

Hello stevenbright,

I tried the following code and everything work like as expected:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 

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

<head runat="server">  

    <title>Untitled Page</title> 

</head> 

<body> 

    <form id="form1" runat="server">  

       <asp:ScriptManager ID="ScriptManager1" runat="server">  

        </asp:ScriptManager> 

    <div> 

      <telerik:raddocklayout runat="server" id="RadDockLayout1">     

            <table id="WebPartLayoutTable" cellpadding="0" cellspacing="0">     

                <tr>    

                    <td colspan="3">     

                        <telerik:RadDockZone ID="Zone1" runat="server" MinHeight="250px" Width="100%" />    

                    </td>    

                </tr>    

                <tr>    

                    <td>    

                        <telerik:RadDockZone ID="Zone2" runat="server" MinHeight="250px" Width="100%" />    

                    </td>    

                    <td>    

                        <telerik:RadDockZone ID="Zone3" runat="server" MinHeight="250px" Width="100%" />    

                    </td>    

                    <td>    

                        <telerik:RadDockZone ID="Zone4" runat="server" MinHeight="250px" Width="100%" />    

                    </td>    

                </tr>    

            </table>    

            <div style="display:none">     

            </div>    

            <telerik:RadDock ID="RadDock1" runat="server"></telerik:RadDock> 

       </telerik:raddocklayout>    

    </div> 

    </form> 

</body> 

</html>

Please note that when not using a DOCTYPE, browsers work in quirks mode, which means that some CSS styles are not applied the way web standards command. I suppose you observe the problem in Internet Explorer - in IE6 min-height is not supported at all, while in IE7 min-height is supported only in standards mode (with DOCTYPE).

If you experienced other issue, please open a new support ticket, send us a simple running project and more detailed information (screenshots demonstrating the issue). Once we have a better view over your exact case, we will do our best to help.

Sincerely yours,
Petio Petkov
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center