How To Remove White Border Around RadDock

[Virgil Rodriguez]

Hi Telerik,

I have RadDocks that I fill with controls and I would like to remove the White Border that shows up (see attached image) so the control fills up the whole area of the RadDock.

Thanks!

[Princy]

Hi,

Try overriding the default CSS as follows.

CSS:

<style type="text/css">
  .RadDockZone
     {
        padding:0px !important;
     }
</style>

Thanks,
Princy.

[Virgil Rodriguez]

Hi Princy,

Did what you suggested but it didn't work. Tried this and it didn't work either:

 

.RadDock .rdTable .rdContent
{
    padding: 0px!important;
}

 

 By the way, these are RadDocks positioned outside of RadDockZones. See my code below and thanks for any other input you or anyone else can give:

 

Dim rdl as New RadDockLayout
Dim rd as New RadDock

Dim ctl as Control

Dim lblField As New Label

lblField.ID = "lblField"

lblField.Text = "Testing 123"

ctl.Controls.Add(lblField)
rd.Resizable = True
rd.DockHandle = DockHandle.Grip


rd.ContentContainer.HorizontalAlign = HorizontalAlign.Left

rd.ContentContainer.Style.Add(HtmlTextWriterStyle.Overflow, "hidden")

rd.ContentContainer.Style.Add(HtmlTextWriterStyle.BackgroundColor, "gray")

rd.ContentContainer.Controls.Add(ctl)
rdl.Controls.Add(rd)



[Virgil Rodriguez]

I have managed to remove the white border using the following, but I lost the ability to resize the dock. Is there any way around this?

 

.rdLeft, .rdBottom, .rdRight
{
     display: none !important;
}

[Virgil Rodriguez]

Here is an update.

I have managed to remove the white borders and still retain the ability to resize the RadDock. I have even managed to reduce the size of the Grip handle to 1px. However, if you will notice from the attached image, there is still actually a white border at the bottom. How can I get rid of it totally ?

.rdGripTop .rdLeft,
.rdGripTop .rdCenter,
.rdGripTop .rdRight
{
    height: 1px !important;
}

.rdLeft, .rdBottom, .rdRight
{
    background-image: none!important;
}

Thanks!

[Princy]

Hi,

Try overriding the default CSS as follows.

CSS:

<style type="text/css">
  .RadDock .rdBottom .rdLeft, .RadDock .rdBottom .rdCenter, .RadDock .rdBottom .rdRight
     {
        background: none!important;
        height:0px !important;
     }
</style>

Hope this helps.

Regards,
Princy.

[Virgil Rodriguez]

That did it !!!
Thanks a bunch Princy!