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

Dock starting as collapsed is showing contents in Lightweight render mode

1 Answer 22 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Francisco Amador
Top achievements
Rank 1
Francisco Amador asked on 20 May 2019, 03:08 AM

I noticed that a simple collapsed dock I have is still showing a bit of the contents when the page loads. If I expand it and collapse it, then it will display properly. Version I have is 2019.2.514

I checked and noticed it was using the Lightweight render mode and that it would be missing "overflow:hidden" in the css in the initial page load.

Code

<telerik:RadDockLayout runat="server" ID="DockLayoutExceptions">
    <telerik:RadDockZone runat="server" ID="DockZoneException" Orientation="Vertical" MinHeight="40px" MinWidth="300px">
        <telerik:RadDock RenderMode="Lightweight" runat="server" ID="DockExceptions" Title="Exceptions" EnableDrag="False" DockMode="Docked" Collapsed="True">
            <Commands>
                <telerik:DockExpandCollapseCommand />
            </Commands>
            <ContentTemplate>
                <cust:ExceptionTable runat="server" ID="tblOrderExceptions" Type="Order" />
            </ContentTemplate>
        </telerik:RadDock>
    </telerik:RadDockZone>
</telerik:RadDockLayout>

 

Attached are images showing the generated CSS at the page load and after expanding and collapsing again.

1 Answer, 1 is accepted

Sort by
0
Accepted
Rumen
Telerik team
answered on 22 May 2019, 04:23 PM
Hi Francisco,

Can you please use the provided CSS class below to resolve the issue:

<style>
    div.RadDock.rdCollapsed {
        height: 31px !important;
    }
</style>
<telerik:RadDockLayout runat="server" ID="DockLayoutExceptions">
    <telerik:RadDockZone runat="server" ID="DockZoneException" Orientation="Vertical" MinHeight="40px" MinWidth="300px">
        <telerik:RadDock RenderMode="Lightweight" runat="server" ID="DockExceptions" Title="Exceptions" EnableDrag="False" DockMode="Docked" Collapsed="True">
            <Commands>
                <telerik:DockExpandCollapseCommand />
            </Commands>
            <ContentTemplate>
                <cust:ExceptionTable runat="server" ID="tblOrderExceptions" Type="Order" />
            </ContentTemplate>
        </telerik:RadDock>
    </telerik:RadDockZone>
</telerik:RadDockLayout>


Regards,
Rumen
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Dock
Asked by
Francisco Amador
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Share this question
or