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

Raddock cannot have 100% height

5 Answers 124 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Edgar
Top achievements
Rank 1
Edgar asked on 29 Jan 2014, 03:19 AM
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



5 Answers, 1 is accepted

Sort by
0
Edgar
Top achievements
Rank 1
answered on 29 Jan 2014, 03:24 AM
0
Edgar
Top achievements
Rank 1
answered on 29 Jan 2014, 03:26 AM
        <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>
0
Edgar
Top achievements
Rank 1
answered on 29 Jan 2014, 03:29 AM
The sample I copy there.

http://www.telerik.com/forums/radock-resize-vertically 
0
Slav
Telerik team
answered on 31 Jan 2014, 04:27 PM
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.
0
Edgar
Top achievements
Rank 1
answered on 04 Feb 2014, 03:45 PM
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



Tags
Dock
Asked by
Edgar
Top achievements
Rank 1
Answers by
Edgar
Top achievements
Rank 1
Slav
Telerik team
Share this question
or