Hi, what I am wonting to do is have rounded corners on my top navigation bar.
My top menu is a "RadMenu" with the "Hay" skin, now I wont the skin theme, but have the corners around the menu bar to be rounded.
Here is what they look like now:
[URL=http://img17.imageshack.us/my.php?image=topnavigation.png][IMG]http://img17.imageshack.us/img17/3985/topnavigation.th.png[/IMG][/URL]
And what Im wanting is something along the lines of:
[URL=http://img17.imageshack.us/my.php?image=topnav.png][IMG]http://img17.imageshack.us/img17/6466/topnav.png[/IMG][/URL]
Would I nee to do this through CSS?
Any help would much appreciated.
My top menu is a "RadMenu" with the "Hay" skin, now I wont the skin theme, but have the corners around the menu bar to be rounded.
Here is what they look like now:
[URL=http://img17.imageshack.us/my.php?image=topnavigation.png][IMG]http://img17.imageshack.us/img17/3985/topnavigation.th.png[/IMG][/URL]
And what Im wanting is something along the lines of:
[URL=http://img17.imageshack.us/my.php?image=topnav.png][IMG]http://img17.imageshack.us/img17/6466/topnav.png[/IMG][/URL]
Would I nee to do this through CSS?
Any help would much appreciated.
3 Answers, 1 is accepted
0
Hello Codie,
As you can see in the Breadcrumb example, a CSS style is applied to the DIV container. Here's a sample code snippet that shows the approach.
Best wishes,
Paul
the Telerik team
Check out Telerik Trainer , the state of the art learning tool for Telerik products.
As you can see in the Breadcrumb example, a CSS style is applied to the DIV container. Here's a sample code snippet that shows the approach.
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head runat="server"> |
| <title></title> |
| <style type="text/css"> |
| #container .RadMenu_Black |
| { |
| background:transparent url("menu-corners.gif") repeat-x scroll 0 1px; |
| padding:0 7px; |
| width:532px; |
| } |
| </style> |
| </head> |
| <body style="background-color: Black"> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> |
| </telerik:RadScriptManager> |
| <div id="container"> |
| <telerik:RadMenu ID="RadMenu1" runat="server" Skin="Black"> |
| <CollapseAnimation Duration="200" Type="OutQuint" /> |
| <Items> |
| <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1"> |
| <Items> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> |
| </telerik:RadMenuItem> |
| </Items> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Root RadMenuItem2"> |
| <Items> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> |
| <Items> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 4"> |
| </telerik:RadMenuItem> |
| </Items> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 4"> |
| </telerik:RadMenuItem> |
| </Items> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Root RadMenuItem3"> |
| <Items> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 3"> |
| </telerik:RadMenuItem> |
| <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 4"> |
| </telerik:RadMenuItem> |
| </Items> |
| </telerik:RadMenuItem> |
| </Items> |
| </telerik:RadMenu> |
| </div> |
| </form> |
| </body> |
| </html> |
Best wishes,
Paul
the Telerik team
Check out Telerik Trainer , the state of the art learning tool for Telerik products.
0
Chuck Drolsbaugh
Top achievements
Rank 1
Rank 1
answered on 15 Sep 2009, 02:13 PM
Can you provide the style sheet (styles.css) for the Menu / Show Path And BreadCrumb example?
0
Hi Chuck,
It's located on the server - you can open it through this link.
Greetings,
Alex
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.
It's located on the server - you can open it through this link.
Greetings,
Alex
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.