THanks
5 Answers, 1 is accepted
Consider converting the skin using the tool we provided with the Q1 2009 SP1 release of the controls:
Using pre-Q1 2009 skins with Q1 2009
Greetings,
Pavlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Thanks
The Q1 2009 release broke a lot of custom skins, because the control's HTML rendering changed (CSS classes naming conventions mostly). However, in order to support multiple versions' CSS skins in this case, we would have to make RadControls render different output, based on some property. This will be a major overhead and will only lead to more confusion. We prefer to help people migrate their custom skins, rather than implementing some complicated logic for the rendering.
All the best,
Pavlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Thanks
<
link href="PGC/Grid.PGC.css" rel="stylesheet" type="text/css" />
<
telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" Skin="PGC" AllowSorting="True" AutoGenerateColumns="False" OnNeedDataSource="RadGrid1_NeedDataSource" PageSize="20" EnableViewState="False" OnItemCommand="RadGrid1_ItemCommand" EnableEmbeddedSkins="False" OnItemDataBound="RadGrid1_ItemDataBound">
<HeaderContextMenu EnableTheming="True" Skin="PGC" EnableEmbeddedSkins="False">
<CollapseAnimation Duration="200" Type="OutQuint" />
/*Telerik RadGrid PGC Skin 2009 Q1*/
/*global*/
.RadGrid_PGC
{
background:#fff;
color:#333333;
}
.RadGrid_PGC
,
.RadGrid_PGC
.RadGrid_PGC .rgMasterTable,
.RadGrid_PGC
.rgDetailTable,
.RadGrid_PGC
.rgGroupPanel table,
.RadGrid_PGC
.rgCommandRow table,
.RadGrid_PGC
.rgEditForm table,
.RadGrid_PGC
.rgPager table,
.GridToolTip_PGC
{
font:12px/16px arial,sans-serif;
}
.RadGrid_PGC
.RadGrid_PGC .rgMasterTable,
.RadGrid_PGC
.rgDetailTable
{
border-collapse:separate;
}
.RadGrid_PGC
.RadGrid_PGC .rgRow,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow,
.RadGrid_PGC
.RadGrid_PGC .rgHeader,
.RadGrid_PGC
.rgResizeCol,F
.RadGrid_PGC
.rgPager,
.RadGrid_PGC
.rgGroupPanel,
.RadGrid_PGC
.rgGroupHeader
{
cursor:default;
}
.RadGrid_PGC
input[type="image"]
{
cursor:pointer;
}
.RadGrid_PGC
.RadGrid_PGC .rgRow td,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow td,
.RadGrid_PGC
.rgEditRow td,
.RadGrid_PGC
.rgFooter td,
.RadGrid_PGC
.rgFilterRow td,
.RadGrid_PGC
.RadGrid_PGC .rgHeader,
.RadGrid_PGC
.rgResizeCol,
.RadGrid_PGC
.rgGroupHeader td
{
padding-left:7px;
padding-right:7px;
}
.RadGrid_PGC
.rgClipCells .RadGrid_PGC .rgHeader,
.RadGrid_PGC
.rgClipCells .RadGrid_PGC .rgRow>td,
.RadGrid_PGC
.rgClipCells .RadGrid_PGC .rgAltRow>td
{
overflow:hidden;
}
.RadGrid_PGC
.RadGrid_PGC .rgHeader:first-child,
.RadGrid_PGC
th.rgResizeCol:first-child,
.RadGrid_PGC
.rgFilterRow>td:first-child,
.RadGrid_PGC
.RadGrid_PGC .rgRow>td:first-child,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow>td:first-child
{
border-left:0;
padding-left:8px;
}
.RadGrid_PGC
.rgAdd,
.RadGrid_PGC
.rgRefresh,
.RadGrid_PGC
.rgEdit,
.RadGrid_PGC
.rgDel,
.RadGrid_PGC
.rgFilter,
.RadGrid_PGC
.rgPagePrev,
.RadGrid_PGC
.rgPageNext,
.RadGrid_PGC
.rgPageFirst,
.RadGrid_PGC
.rgPageLast,
.RadGrid_PGC
.rgExpand,
.RadGrid_PGC
.rgCollapse,
.RadGrid_PGC
.rgSortAsc,
.RadGrid_PGC
.rgSortDesc,
.RadGrid_PGC
.rgUpdate,
.RadGrid_PGC
.rgCancel,
.RadGrid_PGC
.rgUngroup
{
width:16px;
height:16px;
border:0;
margin:0px;
vertical-align:middle;
font-size:1px;
cursor:pointer;
background-color:transparent;
background-image:url('Grid/sprite.gif');
background-repeat:no-repeat;
margin-top: 0px;
padding: 0px;
}
.RadGrid_PGC
.rgGroupItem input,
.RadGrid_PGC
.rgCommandRow img,
.RadGrid_PGC
.RadGrid_PGC .rgHeader input,
.RadGrid_PGC
.rgFilterRow img,
.RadGrid_PGC
.rgFilterRow input,
.RadGrid_PGC
.rgPager img
{
vertical-align:middle;
}
/*header*/
.RadGrid_PGC
.RadGrid_PGC .rgHeaderDiv{}
.rgTwoLines
.RadGrid_PGC .rgHeaderDiv{}
.rgNoScrollImage
.RadGrid_PGC .rgHeaderDiv{}
.RadGrid_PGC
.RadGrid_PGC .rgHeader,
.RadGrid_PGC
th.rgResizeCol
{
padding-top:4px;
padding-bottom:4px;
text-align:left;
font-weight:bold;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FFFFFF;
background-color: #5D7E8C;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
.RadGrid_PGC
th.rgSorted{}
.RadGrid_PGC
.RadGrid_PGC .rgHeader,
.RadGrid_PGC
.RadGrid_PGC .rgHeader a
{
color:#FFFFFF;
text-decoration:none;
}
.RadGrid_PGC
th.rgSorted,
.RadGrid_PGC
th.rgSorted a
{
color:#0f3789;
}
.RadGrid_PGC
.rgCheck
{
height:15px;
margin:0;
padding:0;
}
/*rows*/
.RadGrid_PGC
.RadGrid_PGC .rgRow td,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow td,
.RadGrid_PGC
.rgEditRow td,
.RadGrid_PGC
.rgFooter td
{
border:1px solid;
border-top:0;
padding-top:4px;
padding-bottom:3px;
}
.RadGrid_PGC
.RadGrid_PGC .rgRow td,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow td
{
}
.RadGrid_PGC
.RadGrid_PGC .rgRow
{
border-bottom-color:#9CA7B1;
background-color: #DCE0E4;;
}
.RadGrid_PGC
.RadGrid_PGC .rgAltRow
{
border-bottom-color:#9CA7B1;
background-color:#CBD0D6;
}
.RadGrid_PGC
.rgSelectedRow .rgSorted,
.RadGrid_PGC
.rgActiveRow .rgSorted,
.RadGrid_PGC
.rgHoveredRow .rgSorted,
.RadGrid_PGC
.rgEditRow .rgSorted
{
background-color:#FFFFFF;
}
.RadGrid_PGC
.RadGrid_PGC .rgRow a,
.RadGrid_PGC
.RadGrid_PGC .rgAltRow a,
.RadGrid_PGC
.rgEditRow a,
.RadGrid_PGC
.rgFooter a,
.RadGrid_PGC
.rgEditForm a
{
color:#526577;
}
.RadGrid_PGC
.rgSelectedRow
{
background:#cdffb1;
}
*+html
.RadGrid_PGC .rgSelectedRow .rgSorted{background-color:#cdffb1}
*
html .RadGrid_PGC .rgSelectedRow .rgSorted{background-color:#cdffb1}
.RadGrid_PGC
.rgActiveRow,
.RadGrid_PGC
.rgHoveredRow
{
background:#FFFFFF;
}
*+html
.RadGrid_PGC .rgActiveRow .rgSorted,
*+html
.RadGrid_PGC .rgHoveredRow .rgSorted{background-color:#e3eeff}
*
html .RadGrid_PGC .rgActiveRow .rgSorted,
*
html .RadGrid_PGC .rgHoveredRow .rgSorted{background-color:#e3eeff}
.RadGrid_PGC
.rgEditRow
{
background:#fff;
}
*+html
.RadGrid_PGC .rgEditRow .rgSorted{background-color:#fff}
*
html .RadGrid_PGC .rgEditRow .rgSorted{background-color:#fff}
.RadGrid_PGC
.rgSelectedRow td,
.RadGrid_PGC
.rgActiveRow td,
.RadGrid_PGC
.rgHoveredRow td,
.RadGrid_PGC
.rgEditRow td
{
border-left:0;
border-right:0;
padding-left:8px;
padding-right:8px;
}
.RadGrid_PGC
.rgSelectedRow td,
.RadGrid_PGC
.rgSelectedRow td.rgSorted
{
border-bottom-color:#71bf25;
}
.RadGrid_PGC
.rgActiveRow td,
.RadGrid_PGC
.rgHoveredRow td,
.RadGrid_PGC
.rgActiveRow td.rgSorted,
.RadGrid_PGC
.rgHoveredRow td.rgSorted
{
border-bottom-color:#b1caee;
}
.RadGrid_PGC
.rgEditRow td,
.RadGrid_PGC
.rgEditRow td.rgSorted
{
}
/*footer*/
.RadGrid_PGC
.rgFooterDiv,
.RadGrid_PGC
.rgFooter
{
background:#e3eeff;
}
.RadGrid_PGC
.rgFooter td
{
border-top-width:1px;
border-color:#829cbf #e3eeff #fff #e3eeff;
}
/*status*/
.RadGrid_PGC
.rgPager .rgStatus
{
width:35px;
padding:3px 0 2px;
}
.RadGrid_PGC
.rgStatus div
{
width:24px;
height:24px;
overflow:hidden;
border:0;
margin:0 auto;
padding:0;
background:transparent center center no-repeat url('Common/loading_small.gif');
text-indent:-2222px;
}
/*pager*/
.RadGrid_PGC
.rgPager
{
background:#e3eeff;
}
.RadGrid_PGC
.rgPager td
{
padding:0;
}
.RadGrid_PGC
.rgPager .rgPagerCell
{
padding:5px 0 4px;
}
.RadGrid_PGC
.rgWrap
{
float:left;
padding:0 10px;
line-height:22px;
white-space:nowrap;
}
.RadGrid_PGC
.rgArrPart1
{
padding-right:0;
}
.RadGrid_PGC
.rgArrPart2
{
padding-left:0;
}
.RadGrid_PGC
.rgInfoPart
{
float:right;
color:#666;
}
.RadGrid_PGC
.rgInfoPart strong
{
font-weight:normal;
color:#000;
}
.RadGrid_PGC
.rgArrPart1 img,
.RadGrid_PGC
.rgArrPart2 img
{
margin:0 8px;
}
.RadGrid_PGC
.rgPageFirst,
.RadGrid_PGC
.rgPagePrev,
.RadGrid_PGC
.rgPageNext,
.RadGrid_PGC
.rgPageLast
{
width:22px;
height:22px;
vertical-align:top;
}
.RadGrid_PGC
.NextPrev .rgPageFirst,
.RadGrid_PGC
.NextPrev .rgPagePrev,
.RadGrid_PGC
.NextPrev .rgPageNext,
.RadGrid_PGC
.NextPrev .rgPageLast
{
vertical-align:middle;
}
.RadGrid_PGC
.rgPageFirst
{
background-position:0 -550px;
}
.RadGrid_PGC
.rgPageFirst:hover
{
background-position:0 -600px;
}
.RadGrid_PGC
.rgPagePrev
{
background-position:0 -700px;
}
.RadGrid_PGC
.rgPagePrev:hover
{
background-position:0 -750px;
}
.RadGrid_PGC
.rgPageNext
{
background-position:0 -850px;
}
.RadGrid_PGC
.rgPageNext:hover
{
background-position:0 -900px;
}
.RadGrid_PGC
.rgPageLast
{
background-position:0 -1000px;
}
.RadGrid_PGC
.rgPageLast:hover
{
background-position:0 -1050px;
}
.RadGrid_PGC
.rgPagerButton
{
height:22px;
margin:0 14px 0 0;
padding:0 4px 2px;
background:#466abb repeat-x 0 -1550px url('Grid/sprite.gif');
color:#fff;
font:12px/12px "segoe ui",arial,sans-serif;
vertical-align:middle;
cursor:pointer;
}
.RadGrid_PGC
.rgNumPart
{
padding:0;
}
.RadGrid_PGC
.NumericPages .rgNumPart
{
padding:0 10px;
}
.RadGrid_PGC
.rgNumPart a:hover,
.RadGrid_PGC
.rgNumPart a:hover span,
.RadGrid_PGC
.rgNumPart a.rgCurrentPage,
.RadGrid_PGC
.rgNumPart a.rgCurrentPage span
{
background:no-repeat url('Grid/sprite.gif');
}
.RadGrid_PGC
.rgNumPart a
{
float:left;
line-height:22px;
margin:0;
padding:0 5px 0 0;
color:#000;
text-decoration:none;
}
.RadGrid_PGC
.rgNumPart span
{
float:left;
padding:0 0 0 5px;
}
.RadGrid_PGC
.rgNumPart a:hover
{
background-position:100% -1250px;
color:#0f3789;
}
.RadGrid_PGC
.rgNumPart a:hover span
{
background-position:0 -1150px;
cursor:pointer;
}
.RadGrid_PGC
.rgNumPart a.rgCurrentPage,
.RadGrid_PGC
.rgNumPart a.rgCurrentPage:hover
{
background-position:100% -1450px;
color:#0d202b;
cursor:default;
}
.RadGrid_PGC
.rgNumPart a.rgCurrentPage span,
.RadGrid_PGC
.rgNumPart a.rgCurrentPage:hover span
{
background-position:0 -1350px;
cursor:default;
}
.RadGrid_PGC
.NextPrevNumericAndAdvanced .rgAdvPart
{
float:none;
text-align:center;
}
.RadGrid_PGC
.rgPager .RadSlider
{
float:left;
margin:0 10px 0 0;
}
.RadGrid_PGC
.rgPager .rgPagerLabel,
.RadGrid_PGC
.rgPager .RadComboBox,
.RadGrid_PGC
.rgPager .RadInput_PGC
{
margin:0 4px 0 0;
vertical-align:middle;
}
*+html
.RadGrid_PGC .rgPager .RadComboBox{margin-top:-1px;}
*
html .RadGrid_PGC .rgPager .RadComboBox{margin-top:-1px;padding:1px 0;}
.RadGrid_PGC
.rgPagerTextBox
{
text-align:center;
}
/*sorting, reordering*/
.RadGrid_PGC
.RadGrid_PGC .rgHeader .rgSortAsc
{
background-position:3px -247px;
height:10px;
}
.RadGrid_PGC
.RadGrid_PGC .rgHeader .rgSortDesc
{
background-position:3px -197px;
height:10px;
}
.RadGrid_PGC
.rgSorted .rgSortAsc
{
background-position:3px -147px;
}
.RadGrid_PGC
.rgSorted .rgSortDesc
{
background-position:3px -97px;
}
.GridReorderTop_PGC
,
.GridReorderBottom_PGC
{
width:9px !important;
height:9px !important;
margin-left:-5px;
background:0 0 no-repeat url('Grid/sprite.gif');
}
.GridReorderBottom_PGC
{
background-position:0 -50px;
}
/*filtering*/
.RadGrid_PGC
.rgFilterRow
{
background:#537ab8;
}
.RadGrid_PGC
.rgFilterRow td
{
padding-top:4px;
padding-bottom:5px;
border:1px solid;
border-top:0;
border-color:#537ab8 #537ab8 #3c5c90;
}
.RadGrid_PGC
.rgFilter
{
width:22px;
height:22px;
margin:0 0 0 2px;
background-position:0 -300px;
}
.RadGrid_PGC
.rgFilter:hover
{
background-position:0 -350px;
}
.RadGrid_PGC
.rgFilterActive,
.RadGrid_PGC
.rgFilterActive:hover
{
background-position:0 -400px;
}
.RadGrid_PGC
.rgFilterBox
{
border:1px solid #4e75b3;
padding:2px 1px 3px;
font:12px "segoe ui",arial,sans-serif;
color:#000;
vertical-align:middle;
}
/*grouping*/
.RadGrid_PGC
.rgGroupPanel
{
height:24px;
border:0;
border-bottom:1px solid #4e75b3;
background:#e3eeff;
}
.RadGrid_PGC
.rgGroupPanel td
{
border:0;
padding:3px;
vertical-align:middle;
}
.RadGrid_PGC
.rgGroupPanel td td
{
padding:0;
}
.RadGrid_PGC
.rgGroupPanel .rgSortAsc
{
background-position:4px -144px;
}
.RadGrid_PGC
.rgGroupPanel .rgSortDesc
{
background-position:4px -94px;
}
.RadGrid_PGC
.rgUngroup
{
background-position:0 -6500px;
}
.RadGrid_PGC
.rgGroupItem
{
border:1px solid #4e75b3;
padding:0 2px 1px 3px;
background:#c6d8f2;
color:#0f3789;
line-height:20px;
font-weight:normal;
vertical-align:middle;
}
.RadGrid_PGC
.rgGroupHeader
{
background:#859bbc;
font-size:1.1em;
line-height:21px;
color:#fff;
}
.RadGrid_PGC
.rgGroupHeader td
{
padding:0 8px;
}
.RadGrid_PGC
td.rgGroupCol,
.RadGrid_PGC
td.rgExpandCol
{
background:#859bbc none;
border-color:#859bbc;
}
.RadGrid_PGC
.rgExpand
{
background-position:5px -496px;
}
.RadGrid_PGC
.rgCollapse
{
background-position:3px -444px;
}
.RadGrid_PGC
.rgGroupHeader td p
{
display:inline;
margin:0;
padding:0 10px;
}
.RadGrid_PGC
.rgGroupHeader td div div
{
top:-0.8em;
padding:0 10px;
}
.RadGrid_PGC
.rgGroupHeader td div div div
{
top:0;
padding:0;
border:0;
}
/*editing*/
.RadGrid_PGC
.rgEditForm
{
border-bottom:1px solid #829cbf;
}
.RadGrid_PGC
.rgUpdate
{
background-position:0 -1800px;
}
.RadGrid_PGC
.rgCancel
{
background-position:2px -1848px;
}
/*hierarchy*/
.RadGrid_PGC
.rgDetailTable
{
border:1px solid #4e75b3;
border-right:0;
}
/*command row*/
.RadGrid_PGC
.rgCommandRow
{
background:#1b3879 0 -2100px repeat-x url('Grid/sprite.gif');
color:#fff;
}
.RadGrid_PGC
.rgCommandCell
{
border:0;
padding:3px 7px 4px;
}
.RadGrid_PGC
thead .rgCommandCell
{
border-bottom:1px solid #01144e;
}
.RadGrid_PGC
tfoot .rgCommandCell
{
border-top:1px solid #01144e;
}
.RadGrid_PGC
.rgCommandTable,
.RadGrid_PGC
.rgCommandTable td
{
border:0;
padding:0;
}
.RadGrid_PGC
.rgCommandRow a
{
color:#fff;
text-decoration:none;
}
.RadGrid_PGC
.rgAdd
{
margin-right:3px;
background-position:0 -1650px;
}
.RadGrid_PGC
.rgRefresh
{
margin-right:3px;
background-position:0 -1600px;
}
.RadGrid_PGC
.rgEdit
{
background-position:0 -1700px;
}
.RadGrid_PGC
.rgDel
{
background-position:0 -1750px;
}
/*multirow select*/
.GridRowSelector_PGC
{
background:#1346ad;
}
/*row drag n drop*/
.GridItemDropIndicator_PGC
{
border-top:1px dashed #1346ad;
}
/*tooltip*/
.GridToolTip_PGC
{
border:1px solid #4e75b3;
padding:3px;
background:#e3eeff;
color:#000;
}
/*rtl*/
.RadGridRTL_PGC
.rgHeader,
.RadGridRTL_PGC
.rgResizeCol
{
text-align:right;
}
.RadGridRTL_PGC
.rgHeader:first-child,
.RadGridRTL_PGC
th.rgResizeCol:first-child,
.RadGridRTL_PGC
.rgFilterRow>td:first-child,
.RadGridRTL_PGC
.rgRow>td:first-child,
.RadGridRTL_PGC
.rgAltRow>td:first-child
{
padding-left:7px;
}
.RadGridRTL_PGC
.rgPager .rgStatus
{
border-right:0;
}
.RadGridRTL_PGC
.rgWrap
{
float:right;
}
.RadGridRTL_PGC
.rgInfoPart
{
float:left;
}
.RadGridRTL_PGC
.rgNumPart
{
width:220px;
}
.RadGridRTL_PGC
.rgNumPart a
{
float:right;
}
.RadGridRTL_PGC
.rgDetailTable
{
border-left:0;
}
.PagerLeft_PGC
{
font-family: Arial, Helvetica, sans-serif;
color: #333333;
text-decoration: none;
font-weight: bold;
font-size: 12px;
line-height: 16px;
display: block;
float: right;
padding: 0px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
vertical-align: bottom;
}
.PagerLeft_PGC
a{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: #5D7E8C;
text-decoration: none;
font-size: 12px;
line-height: 16px;
padding: 0px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
vertical-align: middle;
}
.PagerLeft_PGC
a:hover{}
.PagerRight_PGC
{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #333333;
line-height: 30px;
}
.RadGrid_PGC
.rgStatus
{
width:35px;
}
/*paging*/
.RadGrid_PGC
.rgPager
{
line-height:22px;
}
.RadGrid_PGC
.rgPager td
{
padding:0;
}
.RadGrid_PGC
.rgPagerCell
{
}
.RadGrid_PGC
.rgWrap
{
float:left;
padding:0 10px;
}
.RadGrid_PGC
.rgInfoPart
{
float:right;
}
.RadGrid_PGC
.rgArrPart1
{
padding-right:0;
}
.RadGrid_PGC
.rgArrPart2
{
padding-left:0;
}
.RadGrid_PGC
.rgPager .RadComboBox
{
vertical-align:middle;
}
.RadGrid_PGC
.rgNumPart a
{
margin:0 6px;
}
.RadGrid_PGC
.rgPager .RadSlider
{
float:left;
}
/*Telerik RadGrid PGC Skin 2008 Q3*/
/*global*/
.RadGrid_PGC
{
background:#fff;
color:#333333;
}
.RadGrid_PGC,
.RadGrid_PGC .MasterTable_PGC,
.RadGrid_PGC .rgDetailTable,
.RadGrid_PGC .rgGroupPanel table,
.RadGrid_PGC .rgCommandRow table,
.RadGrid_PGC .rgEditForm table,
.RadGrid_PGC .rgPager table,
.GridToolTip_PGC
{
font:12px/16px arial,sans-serif;
}
.RadGrid_PGC .MasterTable_PGC,
.RadGrid_PGC .rgDetailTable
{
border-collapse:separate;
}
.RadGrid_PGC .GridRow_PGC,
.RadGrid_PGC .GridAltRow_PGC,
.RadGrid_PGC .GridHeader_PGC,
.RadGrid_PGC .rgResizeCol,F
.RadGrid_PGC .rgPager,
.RadGrid_PGC .rgGroupPanel,
.RadGrid_PGC .rgGroupHeader
{
cursor:default;
}
.RadGrid_PGC input[type="image"]
{
cursor:pointer;
}
.RadGrid_PGC .GridRow_PGC td,
.RadGrid_PGC .GridAltRow_PGC td,
.RadGrid_PGC .rgEditRow td,
.RadGrid_PGC .rgFooter td,
.RadGrid_PGC .rgFilterRow td,
.RadGrid_PGC .GridHeader_PGC,
.RadGrid_PGC .rgResizeCol,
.RadGrid_PGC .rgGroupHeader td
{
padding-left:7px;
padding-right:7px;
}
.RadGrid_PGC .rgClipCells .GridHeader_PGC,
.RadGrid_PGC .rgClipCells .GridRow_PGC>td,
.RadGrid_PGC .rgClipCells .GridAltRow_PGC>td
{
overflow:hidden;
}
.RadGrid_PGC .GridHeader_PGC:first-child,
.RadGrid_PGC th.rgResizeCol:first-child,
.RadGrid_PGC .rgFilterRow>td:first-child,
.RadGrid_PGC .GridRow_PGC>td:first-child,
.RadGrid_PGC .GridAltRow_PGC>td:first-child
{
border-left:0;
padding-left:8px;
}
.RadGrid_PGC .rgAdd,
.RadGrid_PGC .rgRefresh,
.RadGrid_PGC .rgEdit,
.RadGrid_PGC .rgDel,
.RadGrid_PGC .rgFilter,
.RadGrid_PGC .rgPagePrev,
.RadGrid_PGC .rgPageNext,
.RadGrid_PGC .rgPageFirst,
.RadGrid_PGC .rgPageLast,
.RadGrid_PGC .rgExpand,
.RadGrid_PGC .rgCollapse,
.RadGrid_PGC .rgSortAsc,
.RadGrid_PGC .rgSortDesc,
.RadGrid_PGC .rgUpdate,
.RadGrid_PGC .rgCancel,
.RadGrid_PGC .rgUngroup
{
width:16px;
height:16px;
border:0;
margin:0px;
vertical-align:middle;
font-size:1px;
cursor:pointer;
background-color:transparent;
background-image:url('Grid/sprite.gif');
background-repeat:no-repeat;
margin-top: 0px;
padding: 0px;
}
.RadGrid_PGC .rgGroupItem input,
.RadGrid_PGC .rgCommandRow img,
.RadGrid_PGC .GridHeader_PGC input,
.RadGrid_PGC .rgFilterRow img,
.RadGrid_PGC .rgFilterRow input,
.RadGrid_PGC .rgPager img
{
vertical-align:middle;
}
/*header*/
.RadGrid_PGC .GridHeader_PGCDiv{}
.rgTwoLines .GridHeader_PGCDiv{}
.rgNoScrollImage .GridHeader_PGCDiv{}
.RadGrid_PGC .GridHeader_PGC,
.RadGrid_PGC th.rgResizeCol
{
padding-top:4px;
padding-bottom:4px;
text-align:left;
font-weight:bold;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FFFFFF;
background-color: #5D7E8C;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
.RadGrid_PGC th.rgSorted{}
.RadGrid_PGC .GridHeader_PGC,
.RadGrid_PGC .GridHeader_PGC a
{
color:#FFFFFF;
text-decoration:none;
}
.RadGrid_PGC th.rgSorted,
.RadGrid_PGC th.rgSorted a
{
color:#0f3789;
}
.RadGrid_PGC .rgCheck
{
height:15px;
margin:0;
padding:0;
}
/*rows*/
.RadGrid_PGC .GridRow_PGC td,
.RadGrid_PGC .GridAltRow_PGC td,
.RadGrid_PGC .rgEditRow td,
.RadGrid_PGC .rgFooter td
{
border:1px solid;
border-top:0;
padding-top:4px;
padding-bottom:3px;
}
.RadGrid_PGC .GridRow_PGC td,
.RadGrid_PGC .GridAltRow_PGC td
{
}
.RadGrid_PGC .GridRow_PGC
{
border-bottom-color:#9CA7B1;
background-color: #DCE0E4;;
}
.RadGrid_PGC .GridAltRow_PGC
{
border-bottom-color:#9CA7B1;
background-color:#CBD0D6;
}
.RadGrid_PGC .rgSelectedRow .rgSorted,
.RadGrid_PGC .rgActiveRow .rgSorted,
.RadGrid_PGC .rgHoveredRow .rgSorted,
.RadGrid_PGC .rgEditRow .rgSorted
{
background-color:#FFFFFF;
}
.RadGrid_PGC .GridRow_PGC a,
.RadGrid_PGC .GridAltRow_PGC a,
.RadGrid_PGC .rgEditRow a,
.RadGrid_PGC .rgFooter a,
.RadGrid_PGC .rgEditForm a
{
color:#526577;
}
.RadGrid_PGC .rgSelectedRow
{
background:#cdffb1;
}
*+html .RadGrid_PGC .rgSelectedRow .rgSorted{background-color:#cdffb1}
* html .RadGrid_PGC .rgSelectedRow .rgSorted{background-color:#cdffb1}
.RadGrid_PGC .rgActiveRow,
.RadGrid_PGC .rgHoveredRow
{
background:#FFFFFF;
}
*+html .RadGrid_PGC .rgActiveRow .rgSorted,
*+html .RadGrid_PGC .rgHoveredRow .rgSorted{background-color:#e3eeff}
* html .RadGrid_PGC .rgActiveRow .rgSorted,
* html .RadGrid_PGC .rgHoveredRow .rgSorted{background-color:#e3eeff}
.RadGrid_PGC .rgEditRow
{
background:#fff;
}
*+html .RadGrid_PGC .rgEditRow .rgSorted{background-color:#fff}
* html .RadGrid_PGC .rgEditRow .rgSorted{background-color:#fff}
.RadGrid_PGC .rgSelectedRow td,
.RadGrid_PGC .rgActiveRow td,
.RadGrid_PGC .rgHoveredRow td,
.RadGrid_PGC .rgEditRow td
{
border-left:0;
border-right:0;
padding-left:8px;
padding-right:8px;
}
.RadGrid_PGC .rgSelectedRow td,
.RadGrid_PGC .rgSelectedRow td.rgSorted
{
border-bottom-color:#71bf25;
}
.RadGrid_PGC .rgActiveRow td,
.RadGrid_PGC .rgHoveredRow td,
.RadGrid_PGC .rgActiveRow td.rgSorted,
.RadGrid_PGC .rgHoveredRow td.rgSorted
{
border-bottom-color:#b1caee;
}
.RadGrid_PGC .rgEditRow td,
.RadGrid_PGC .rgEditRow td.rgSorted
{
}
/*footer*/
.RadGrid_PGC .rgFooterDiv,
.RadGrid_PGC .rgFooter
{
background:#e3eeff;
}
.RadGrid_PGC .rgFooter td
{
border-top-width:1px;
border-color:#829cbf #e3eeff #fff #e3eeff;
}
/*status*/
.RadGrid_PGC .rgPager .rgStatus
{
width:35px;
padding:3px 0 2px;
}
.RadGrid_PGC .rgStatus div
{
width:24px;
height:24px;
overflow:hidden;
border:0;
margin:0 auto;
padding:0;
background:transparent center center no-repeat url('Common/loading_small.gif');
text-indent:-2222px;
}
/*pager*/
.RadGrid_PGC .rgPager
{
background:#e3eeff;
}
.RadGrid_PGC .rgPager td
{
padding:0;
}
.RadGrid_PGC .rgPager .rgPagerCell
{
padding:5px 0 4px;
}
.RadGrid_PGC .rgWrap
{
float:left;
padding:0 10px;
line-height:22px;
white-space:nowrap;
}
.RadGrid_PGC .rgArrPart1
{
padding-right:0;
}
.RadGrid_PGC .rgArrPart2
{
padding-left:0;
}
.RadGrid_PGC .rgInfoPart
{
float:right;
color:#666;
}
.RadGrid_PGC .rgInfoPart strong
{
font-weight:normal;
color:#000;
}
.RadGrid_PGC .rgArrPart1 img,
.RadGrid_PGC .rgArrPart2 img
{
margin:0 8px;
}
.RadGrid_PGC .rgPageFirst,
.RadGrid_PGC .rgPagePrev,
.RadGrid_PGC .rgPageNext,
.RadGrid_PGC .rgPageLast
{
width:22px;
height:22px;
vertical-align:top;
}
.RadGrid_PGC .NextPrev .rgPageFirst,
.RadGrid_PGC .NextPrev .rgPagePrev,
.RadGrid_PGC .NextPrev .rgPageNext,
.RadGrid_PGC .NextPrev .rgPageLast
{
vertical-align:middle;
}
.RadGrid_PGC .rgPageFirst
{
background-position:0 -550px;
}
.RadGrid_PGC .rgPageFirst:hover
{
background-position:0 -600px;
}
.RadGrid_PGC .rgPagePrev
{
background-position:0 -700px;
}
.RadGrid_PGC .rgPagePrev:hover
{
background-position:0 -750px;
}
.RadGrid_PGC .rgPageNext
{
background-position:0 -850px;
}
.RadGrid_PGC .rgPageNext:hover
{
background-position:0 -900px;
}
.RadGrid_PGC .rgPageLast
{
background-position:0 -1000px;
}
.RadGrid_PGC .rgPageLast:hover
{
background-position:0 -1050px;
}
.RadGrid_PGC .rgPagerButton
{
height:22px;
margin:0 14px 0 0;
padding:0 4px 2px;
background:#466abb repeat-x 0 -1550px url('Grid/sprite.gif');
color:#fff;
font:12px/12px "segoe ui",arial,sans-serif;
vertical-align:middle;
cursor:pointer;
}
.RadGrid_PGC .rgNumPart
{
padding:0;
}
.RadGrid_PGC .NumericPages .rgNumPart
{
padding:0 10px;
}
.RadGrid_PGC .rgNumPart a:hover,
.RadGrid_PGC .rgNumPart a:hover span,
.RadGrid_PGC .rgNumPart a.rgCurrentPage,
.RadGrid_PGC .rgNumPart a.rgCurrentPage span
{
background:no-repeat url('Grid/sprite.gif');
}
.RadGrid_PGC .rgNumPart a
{
float:left;
line-height:22px;
margin:0;
padding:0 5px 0 0;
color:#000;
text-decoration:none;
}
.RadGrid_PGC .rgNumPart span
{
float:left;
padding:0 0 0 5px;
}
.RadGrid_PGC .rgNumPart a:hover
{
background-position:100% -1250px;
color:#0f3789;
}
.RadGrid_PGC .rgNumPart a:hover span
{
background-position:0 -1150px;
cursor:pointer;
}
.RadGrid_PGC .rgNumPart a.rgCurrentPage,
.RadGrid_PGC .rgNumPart a.rgCurrentPage:hover
{
background-position:100% -1450px;
color:#0d202b;
cursor:default;
}
.RadGrid_PGC .rgNumPart a.rgCurrentPage span,
.RadGrid_PGC .rgNumPart a.rgCurrentPage:hover span
{
background-position:0 -1350px;
cursor:default;
}
.RadGrid_PGC .NextPrevNumericAndAdvanced .rgAdvPart
{
float:none;
text-align:center;
}
.RadGrid_PGC .rgPager .RadSlider
{
float:left;
margin:0 10px 0 0;
}
.RadGrid_PGC .rgPager .rgPagerLabel,
.RadGrid_PGC .rgPager .RadComboBox,
.RadGrid_PGC .rgPager .RadInput_PGC
{
margin:0 4px 0 0;
vertical-align:middle;
}
*+html .RadGrid_PGC .rgPager .RadComboBox{margin-top:-1px;}
* html .RadGrid_PGC .rgPager .RadComboBox{margin-top:-1px;padding:1px 0;}
.RadGrid_PGC .rgPagerTextBox
{
text-align:center;
}
/*sorting, reordering*/
.RadGrid_PGC .GridHeader_PGC .rgSortAsc
{
background-position:3px -247px;
height:10px;
}
.RadGrid_PGC .GridHeader_PGC .rgSortDesc
{
background-position:3px -197px;
height:10px;
}
.RadGrid_PGC .rgSorted .rgSortAsc
{
background-position:3px -147px;
}
.RadGrid_PGC .rgSorted .rgSortDesc
{
background-position:3px -97px;
}
.GridReorderTop_PGC,
.GridReorderBottom_PGC
{
width:9px !important;
height:9px !important;
margin-left:-5px;
background:0 0 no-repeat url('Grid/sprite.gif');
}
.GridReorderBottom_PGC
{
background-position:0 -50px;
}
/*filtering*/
.RadGrid_PGC .rgFilterRow
{
background:#537ab8;
}
.RadGrid_PGC .rgFilterRow td
{
padding-top:4px;
padding-bottom:5px;
border:1px solid;
border-top:0;
border-color:#537ab8 #537ab8 #3c5c90;
}
.RadGrid_PGC .rgFilter
{
width:22px;
height:22px;
margin:0 0 0 2px;
background-position:0 -300px;
}
.RadGrid_PGC .rgFilter:hover
{
background-position:0 -350px;
}
.RadGrid_PGC .rgFilterActive,
.RadGrid_PGC .rgFilterActive:hover
{
background-position:0 -400px;
}
.RadGrid_PGC .rgFilterBox
{
border:1px solid #4e75b3;
padding:2px 1px 3px;
font:12px "segoe ui",arial,sans-serif;
color:#000;
vertical-align:middle;
}
/*grouping*/
.RadGrid_PGC .rgGroupPanel
{
height:24px;
border:0;
border-bottom:1px solid #4e75b3;
background:#e3eeff;
}
.RadGrid_PGC .rgGroupPanel td
{
border:0;
padding:3px;
vertical-align:middle;
}
.RadGrid_PGC .rgGroupPanel td td
{
padding:0;
}
.RadGrid_PGC .rgGroupPanel .rgSortAsc
{
background-position:4px -144px;
}
.RadGrid_PGC .rgGroupPanel .rgSortDesc
{
background-position:4px -94px;
}
.RadGrid_PGC .rgUngroup
{
background-position:0 -6500px;
}
.RadGrid_PGC .rgGroupItem
{
border:1px solid #4e75b3;
padding:0 2px 1px 3px;
background:#c6d8f2;
color:#0f3789;
line-height:20px;
font-weight:normal;
vertical-align:middle;
}
.RadGrid_PGC .rgGroupHeader
{
background:#859bbc;
font-size:1.1em;
line-height:21px;
color:#fff;
}
.RadGrid_PGC .rgGroupHeader td
{
padding:0 8px;
}
.RadGrid_PGC td.rgGroupCol,
.RadGrid_PGC td.rgExpandCol
{
background:#859bbc none;
border-color:#859bbc;
}
.RadGrid_PGC .rgExpand
{
background-position:5px -496px;
}
.RadGrid_PGC .rgCollapse
{
background-position:3px -444px;
}
.RadGrid_PGC .rgGroupHeader td p
{
display:inline;
margin:0;
padding:0 10px;
}
.RadGrid_PGC .rgGroupHeader td div div
{
top:-0.8em;
padding:0 10px;
}
.RadGrid_PGC .rgGroupHeader td div div div
{
top:0;
padding:0;
border:0;
}
/*editing*/
.RadGrid_PGC .rgEditForm
{
border-bottom:1px solid #829cbf;
}
.RadGrid_PGC .rgUpdate
{
background-position:0 -1800px;
}
.RadGrid_PGC .rgCancel
{
background-position:2px -1848px;
}
/*hierarchy*/
.RadGrid_PGC .rgDetailTable
{
border:1px solid #4e75b3;
border-right:0;
}
/*command row*/
.RadGrid_PGC .rgCommandRow
{
background:#1b3879 0 -2100px repeat-x url('Grid/sprite.gif');
color:#fff;
}
.RadGrid_PGC .rgCommandCell
{
border:0;
padding:3px 7px 4px;
}
.RadGrid_PGC thead .rgCommandCell
{
border-bottom:1px solid #01144e;
}
.RadGrid_PGC tfoot .rgCommandCell
{
border-top:1px solid #01144e;
}
.RadGrid_PGC .rgCommandTable,
.RadGrid_PGC .rgCommandTable td
{
border:0;
padding:0;
}
.RadGrid_PGC .rgCommandRow a
{
color:#fff;
text-decoration:none;
}
.RadGrid_PGC .rgAdd
{
margin-right:3px;
background-position:0 -1650px;
}
.RadGrid_PGC .rgRefresh
{
margin-right:3px;
background-position:0 -1600px;
}
.RadGrid_PGC .rgEdit
{
background-position:0 -1700px;
}
.RadGrid_PGC .rgDel
{
background-position:0 -1750px;
}
/*multirow select*/
.GridRowSelector_PGC
{
background:#1346ad;
}
/*row drag n drop*/
.GridItemDropIndicator_PGC
{
border-top:1px dashed #1346ad;
}
/*tooltip*/
.GridToolTip_PGC
{
border:1px solid #4e75b3;
padding:3px;
background:#e3eeff;
color:#000;
}
/*rtl*/
.RadGridRTL_PGC .GridHeader_PGC,
.RadGridRTL_PGC .rgResizeCol
{
text-align:right;
}
.RadGridRTL_PGC .GridHeader_PGC:first-child,
.RadGridRTL_PGC th.rgResizeCol:first-child,
.RadGridRTL_PGC .rgFilterRow>td:first-child,
.RadGridRTL_PGC .GridRow_PGC>td:first-child,
.RadGridRTL_PGC .GridAltRow_PGC>td:first-child
{
padding-left:7px;
}
.RadGridRTL_PGC .rgPager .rgStatus
{
border-right:0;
}
.RadGridRTL_PGC .rgWrap
{
float:right;
}
.RadGridRTL_PGC .rgInfoPart
{
float:left;
}
.RadGridRTL_PGC .rgNumPart
{
width:220px;
}
.RadGridRTL_PGC .rgNumPart a
{
float:right;
}
.RadGridRTL_PGC .rgDetailTable
{
border-left:0;
}
.PagerLeft_PGC{
font-family: Arial, Helvetica, sans-serif;
color: #333333;
text-decoration: none;
font-weight: bold;
font-size: 12px;
line-height: 16px;
display: block;
float: right;
padding: 0px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
vertical-align: bottom;
}
.PagerLeft_PGC a{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: #5D7E8C;
text-decoration: none;
font-size: 12px;
line-height: 16px;
padding: 0px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
vertical-align: middle;
}
.PagerLeft_PGC a:hover{}
.PagerRight_PGC{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #333333;
line-height: 30px;
}
Registering custom skin requires the developer to manually add the corresponding link tags.
Please review the following help article for more information about how to register custom skin:
Skin registration
All the best,
Pavlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.