Raddock cannot have 100% height

6 posts, 0 answers
  1. Edgar
    Edgar avatar
    5 posts
    Member since:
    Jan 2014

    Posted 28 Jan 2014 Link to this post

    Hi telerik team,

    I have got an issue when I am using RadDock. 
    The code was copy from the other thread in this forum.
    I would like to fill the dock with a Div 100% height and width.

    Radtreeview with no docking:


    Radtreeview with docking:



    before 


    after collapse

    Expands



  2. Edgar
    Edgar avatar
    5 posts
    Member since:
    Jan 2014
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Edgar
    Edgar avatar
    5 posts
    Member since:
    Jan 2014

    Posted 28 Jan 2014 in reply to Edgar Link to this post

            <div style="width:20%; height:100%; float:left;" >

                <telerik:RadDockLayout ID="RadDockLayout1" runat="server">
                    <telerik:RadDockZone ID="RadDockZone1" runat="server" Height="98%" Width="98%" BorderColor="Transparent">
                        <telerik:RadDock ID="RadDock1" runat="server" DockMode="Docked" EnableRoundedCorners="true" EnableDrag="false" DefaultCommands="None" Width="100%" Height="100%">
                            <ContentTemplate>


                                    <telerik:RadTreeView ID="RadTreeView1" Runat="server" BackColor="Yellow" Skin="Outlook" OnNodeClick="RadTreeView1_NodeClick" Width="100%" Height="100%">
                                    </telerik:RadTreeView>  


                            </ContentTemplate>
                        </telerik:RadDock>
                    </telerik:RadDockZone>
                </telerik:RadDockLayout>
        </div>
  5. Edgar
    Edgar avatar
    5 posts
    Member since:
    Jan 2014

    Posted 28 Jan 2014 in reply to Edgar Link to this post

    The sample I copy there.

    http://www.telerik.com/forums/radock-resize-vertically 
  6. Slav
    Admin
    Slav avatar
    1356 posts

    Posted 31 Jan 2014 Link to this post

    Hi Edgar,

    The RadDock has a fixed width, configured in pixels, so fitting its content in the ContentContainer of the control is not possible out of the box. Also, there is a small distance between the edge of the dock and its content.

    Nevertheless, you could use custom script to configure the width of the dock according to its content and you can set it RenderMode to Lightweight in order to remove the space at the edge easily. Please check the attached sample and use it as a reference for achieving the desired result.

    Regards,
    Slav
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
  7. Edgar
    Edgar avatar
    5 posts
    Member since:
    Jan 2014

    Posted 04 Feb 2014 in reply to Slav Link to this post

    Thank's Slav,

    I found that I add height:100% !important; like this:
    <style type="text/css">
    div.RadDock .rdContent {
        margin: 0;
        height:100% !important;
    }
    </style>
    and it is working now.

    I also found how to make div 100% height & width in the browser:
    <style type="text/css">
           .main {
        top:0;
        bottom:0;
        left:0;
        right:0;
        min-width:1024px;
        min-height:768px;
        position:absolute;
    }
    </style>



    Thanks a lot

    Edgar



Back to Top
UI for ASP.NET Ajax is Ready for VS 2017