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

Round corners on Rad Docks

3 Answers 85 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Sam
Top achievements
Rank 1
Sam asked on 13 Apr 2009, 03:09 PM
I found a couple of posts on this subject but no actual step by step instructions. Can someone tell me exactly how to achieve round corners on the rad docks? I know you have to change the background color to match the web site in some CSS file somewhere but I cannot find it.

Thanks!
Sam

3 Answers, 1 is accepted

Sort by
0
Martin
Telerik team
answered on 14 Apr 2009, 05:47 AM
Hi Sam,

The current implementation of RadDock allows rounded corners designs, but in order to achieve this, you have to set the resizable property of the control to "true". Then you will have enough elememts to stick to in order to create rounded corners designs. Once you set the resizable="true", use Internet Explorer Developer Toolbar or FireBug to inspect the new corner, top and side elements of RadDock. You will now have a couple of additional classes and elements that wrap the dock: .rdLeftMiddle, .rdTopLeft, .rdTopCenter, etc that you can use and add the necessary images to achieve roundness. You may test this on the following page (RadDock 2 is resizable):

http://demos.telerik.com/aspnet-ajax/dock/examples/dockresize/defaultcs.aspx

Please, have in mind that any modifications or additional CSS values should be forced with !important, otherwise they will not apply, i.e:

<style type="text/css">
.rdTopLeft
{
    background: lime !important;
}
</style>


Greetings,
Martin Ivanov
the Telerik team

Check out Telerik Trainer , the state of the art learning tool for Telerik products.
0
Sam
Top achievements
Rank 1
answered on 24 Apr 2009, 03:42 PM
Thanks for the information, what do you mean by this?  "use Internet Explorer Developer Toolbar or FireBug to inspect the new corner" , I don't understand what you are saying.

Thanks,
Sam
0
ManniAT
Top achievements
Rank 2
answered on 24 Apr 2009, 04:14 PM
These two things are tools that allow you to view the content of your page in a kind of a treeview (they do more - but in this case it's about the elements of the page). Take a look at the screenshots on the firebug link provided below - I guess that explains better what I mean.

If you have IE8 try pressing F12. (I'm not sure if this feature is installed by default).

For FF look here https://addons.mozilla.org/de/firefox/addon/1843 (look for screenshots here - even if you don't use FF - the IE tools look something like firebug)

For older versions of IE - take a look here: http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en (that's the developer toolbar)

These tools are almost a must if you run in layout problems - or simply want to find out what's going on at the page you built.

Regards

Manfred
Tags
Dock
Asked by
Sam
Top achievements
Rank 1
Answers by
Martin
Telerik team
Sam
Top achievements
Rank 1
ManniAT
Top achievements
Rank 2
Share this question
or