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

Space Between RadDcoks

8 Answers 240 Views

Dock

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

8 Answers, 1 is accepted

Accepted

answered on 17 Sep 2008, 07:29 AM

SpaceBetweenDocks.zip

Hello Paul,

I am not sure what is your exact setup but if you add the following style between the head tags of the page a 3px space between the docks should be applied:

    
            <style type="text/css">  
        
            .raddock  
        
            {  
        
                margin-bottom:3px !important;  
        
            }  
        
            </style>

I have attached a simple sample page which demonstrates the above suggestion. In case you still experience any problems in achieving the desired layout, please, send us code snippets which demonstrate your setup and reproduce the issue. We will be glad to help you.

All the best,
Sophy
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

Accepted

answered on 08 Oct 2009, 12:47 PM

Hi Matthew,

I tested the CSS code and it works with the latest version. Here is the project that I tested:

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

<!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 id="Head1" runat="server">

<title></title>

<style type="text/css">

.RadDock

{

margin-bottom: 10px !important;

}

</style>

</head>

<body>

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

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

</asp:ScriptManager>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadDockZone1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadDockZone1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div>

<telerik:RadDockLayout ID="RadDockLayout1" runat="server">

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">

</telerik:RadAjaxPanel>

<telerik:RadDockZone ID="RadDockZone1" runat="server" Height="600px" Width="300px">

<telerik:RadDock ID="RadDock1" AutoPostBack="true" CommandsAutoPostBack="true" runat="server"

Width="300px" Title="RadDock1-Title" DockMode="Docked">

<ContentTemplate>

<br />

RAD DOCK 1

<br />

<asp:Button ID="Button1" runat="server" Text="Postback (AJAX)" />

<br />

</ContentTemplate>

</telerik:RadDock>

<telerik:RadDock ID="RadDock2" AutoPostBack="true" CommandsAutoPostBack="true" runat="server"

Width="300px" Title="RadDock2-Title" DockMode="Docked">

<ContentTemplate>

<br />

CONTENT DOCK 2

<br />

<asp:Button ID="Button2" runat="server" Text="Postback (AJAX)" />

<br />

</ContentTemplate>

</telerik:RadDock>

<telerik:RadDock ID="RadDock3" AutoPostBack="true" CommandsAutoPostBack="true" runat="server"

Width="300px" Title="RadDock3-Title" DockMode="Docked">

<ContentTemplate>

<br />

CONTENT

<br />

<asp:Button ID="Button3" runat="server" Text="Postback (AJAX)" />

<br />

</ContentTemplate>

</telerik:RadDock>

</telerik:RadDockZone>

</telerik:RadDockLayout>

</div>

</form>

</body>

</html>

Please make sure that you are not applying any global CSS styles that might override the above setting. If you still experience problems please send us the source code of your project together with the CSS code (styling) and we will help you resolve the issue.

Greetings,
Pero
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Space Between RadDcoks

8 Answers, 1 is accepted