Article information
Article relates to
RadPanelBar v3.x RadMenu v3.x RadTabStrip v2.x
Created by
Paul, Telerik
Last modified by
Veskoni, Telerik
#RadPanelBar1 .panelbarHeaderCollapsed { FONT-SIZE: 11px; COLOR: White; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; height: 39px; background-repeat: no-repeat; background-position: center; padding: 7px 0px 0px 67px; background-image: url(../Img/HeaderCollapsed.jpg); }
#RadPanelBar1 .panelbarHeaderHover { FONT-SIZE: 11px; COLOR: Blue; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; height: 39px; background-repeat: no-repeat; background-position: center; padding: 7px 0px 0px 67px; background-image: url(../Img/HeaderCollapsed.jpg); }
#RadPanelBar1 .panelbarHeaderExpand { FONT-SIZE: 11px; COLOR: Black; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; height: 39px; background-repeat: no-repeat; background-position: center; padding: 12px 0px 0px 67px; background-image: url(../Img/HeaderExpanded.jpg); }
#RadPanelBar1 .panelbarItem { FONT-SIZE: 11px; COLOR: Black; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; padding-bottom: 9px; padding-left: 67px; height: 16px; box-sizing: border-box; -moz-box-sizing: border-box; background-image: url(../Img/itemsArrow.gif); background-repeat: no-repeat; background-position: 20px 5px; }
#RadPanelBar1 .panelbarItemHover { FONT-SIZE: 11px; COLOR: Red; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; padding-bottom: 9px; padding-left: 67px; height: 16px; box-sizing: border-box; -moz-box-sizing: border-box; background-image: url(../Img/itemsArrow.gif); background-repeat: no-repeat; background-position: 20px 5px; } #RadPanelBar1 .panelbarItemSelected { FONT-SIZE: 11px; COLOR: White; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; padding-bottom: 9px; padding-left: 67px; height: 16px; box-sizing: border-box; -moz-box-sizing: border-box; background-image: url(../Img/itemsArrow.gif); background-repeat: no-repeat; background-position: 20px 5px; } #RadPanelBar1 .panelbarItemGroup { background-image: url(../Img/itemsBg.jpg); background-repeat: no-repeat; background-position: bottom; }
#RadPanelBar1 .Panelbar { background-image: url(../Img/bg.gif); } Thus you will force the browser to be aware that those css conventions should be enclosed to the panel items of the first panelbar control. Those changes are also applicable if you appear to have three, four, etc. panelbars on the page - just alternate the css file of the respective panelbar objects (#RadPanelBar2 , #RadPanelBar3 , etc.). To use a skin from several panelbars at the same time do the following: #RadPanelBar1 .panelbarItem,#RadPanelBar3 .panelbarItem { FONT-SIZE: 11px; COLOR: Black; FONT-FAMILY: Arial,Verdana; cursor: hand; cursor: pointer; padding-bottom: 9px; padding-left: 67px; height: 16px; box-sizing: border-box; -moz-box-sizing: border-box; background-image: url(../Img/itemsArrow.gif); background-repeat: no-repeat; background-position: 20px 5px; } Note that similar modifications can be made for RadMenu and RadTabStrip when used in a situation like the one described above.
Resources Buy Try