Shahryar Ali
Top achievements
Rank 1
Rank 1
Shahryar Ali
asked on 13 May 2010, 04:57 PM
I have inserted sliding panes with the TabView="ImageOnly" and IconUrl properties set. This worked, but the appearance is odd because the image only fills the center portion of the tab - the edges of the tab still have a Gray color.
I saw a previous thread where the solution suggested by a Telerik support rep was to set the Width property of the tab.
So, my question is, if that is the correct solution, how do you set the Width of the tab? I tried inserting a Width property into the RadSlidingZone, RadSlidingPane, no luck. The Tab has an IconUrl property set, but there's extra space around both sides of the image, and it looks odd.
Thanks,
Shahryar
1 Answer, 1 is accepted
0
Accepted
Hi Shahryar Ali,
I already posted the answer to your question in the other forum thread - http://www.telerik.com/community/forums/aspnet-ajax/splitter/center-align-icon-for-sliding-pane.aspx. For your convenience, I give you the information here as well:
The extra space that you see is a result of the padding and margin style settings, defined in the skin of the splitter control. In case you want to remove those, you can use the following CSS selectors:
In case you want to make more changes to the skin of the splitter, I would recommend that you create a custom skin. For information on custom skins, please refer to our online documentation:
All the best,
Tsvetie
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
I already posted the answer to your question in the other forum thread - http://www.telerik.com/community/forums/aspnet-ajax/splitter/center-align-icon-for-sliding-pane.aspx. For your convenience, I give you the information here as well:
The extra space that you see is a result of the padding and margin style settings, defined in the skin of the splitter control. In case you want to remove those, you can use the following CSS selectors:
Copy Code
<head runat="server"> <title></title> <style type="text/css"> .RadSplitter .rspTop div.rspPaneTabContainer, .RadSplitter .rspBottom div.rspPaneTabContainer { padding: 0; } .RadSplitter .rspPaneTabContainer .rspPaneTabIcon { margin: 0; } </style></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal"> <telerik:RadPane ID="RadPane1" runat="server" Height="50px" Scrolling="None"> <telerik:RadSlidingZone ID="RadSlidingZone1" runat="server" SlideDirection="Bottom" Height="50px"> <telerik:RadSlidingPane ID="RadSlidingPane1" runat="server" Title="Pane 1" TabView="ImageOnly" IconUrl="SlidingPaneIcon.jpg"> </telerik:RadSlidingPane> </telerik:RadSlidingZone> </telerik:RadPane> <telerik:RadPane ID="RadPane2" runat="server"> </telerik:RadPane> <telerik:RadPane ID="RadPane3" runat="server" Height="50px" Scrolling="None"> <telerik:RadSlidingZone ID="RadSlidingZone2" runat="server" SlideDirection="Top" Height="50px"> <telerik:RadSlidingPane ID="RadSlidingPane2" runat="server" Title="Pane 1" TabView="ImageOnly" IconUrl="SlidingPaneIcon.jpg"> </telerik:RadSlidingPane> </telerik:RadSlidingZone> </telerik:RadPane> </telerik:RadSplitter> </form></body>In case you want to make more changes to the skin of the splitter, I would recommend that you create a custom skin. For information on custom skins, please refer to our online documentation:
- http://www.telerik.com/help/aspnet-ajax/controlling-appearance-overview.html
- http://www.telerik.com/help/aspnet-ajax/splitter_appearancecontrollingappearance.html
All the best,
Tsvetie
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.