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

Grid Formatting Issue after updating to Q1 2010

2 Answers 31 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Joe
Top achievements
Rank 1
Joe asked on 23 Mar 2010, 07:06 AM
Hi!

After updating to Q1 2010 my custom skin for the grid control now has a separator every two lines for some reason... Why would that be happening and how can I change that? I'm attaching an image as well of what I mean... Please see my CSS for the skin:

/*Telerik RadGrid Default Skin*/ 
 
/*global*/ 
 
.RadGrid_GridBannered  
{  
    background-position#fff;  
    border1px solid #828282;  
    background#ffffff;  
    color#000000;  
}  
 
.RadGrid_GridBannered,  
.RadGrid_GridBannered .rgMasterTable,  
.RadGrid_GridBannered .rgDetailTable,  
.RadGrid_GridBannered .rgGroupPanel table,  
.RadGrid_GridBannered .rgCommandRow table,  
.RadGrid_GridBannered .rgEditForm table,  
.RadGrid_GridBannered .rgPager table,  
.GridToolTip_GridBannered  
{  
    font:12px/16px arial,sans-serif;  
}  
 
.RadGrid_GridBannered .rgMasterTable,  
.RadGrid_GridBannered .rgDetailTable  
{  
    border-collapse:separate;  
}  
 
.RadGrid_GridBannered .rgRow,  
.RadGrid_GridBannered .rgAltRow,  
.RadGrid_GridBannered .rgHeader,  
.RadGrid_GridBannered .rgResizeCol,  
.RadGrid_GridBannered .rgPager,  
.RadGrid_GridBannered .rgGroupPanel,  
.RadGrid_GridBannered .rgGroupHeader  
{  
    cursor:default;  
}  
 
.RadGrid_GridBannered input[type="image"]  
{  
    cursor:pointer;  
}  
 
.RadGrid_GridBannered .rgRow td,  
.RadGrid_GridBannered .rgAltRow td,  
.RadGrid_GridBannered .rgEditRow td,  
.RadGrid_GridBannered .rgFooter td,  
.RadGrid_GridBannered .rgFilterRow td,  
.RadGrid_GridBannered .rgHeader,  
.RadGrid_GridBannered .rgResizeCol,  
.RadGrid_GridBannered .rgGroupHeader td  
{  
    padding-left:7px;  
    padding-right:7px;  
}  
 
.RadGrid_GridBannered .rgClipCells .rgHeader,  
.RadGrid_GridBannered .rgClipCells .rgRow>td,  
.RadGrid_GridBannered .rgClipCells .rgAltRow>td  
{  
    overflow:hidden;  
}  
 
.RadGrid_GridBannered .rgAdd,  
.RadGrid_GridBannered .rgRefresh,  
.RadGrid_GridBannered .rgEdit,  
.RadGrid_GridBannered .rgDel,  
.RadGrid_GridBannered .rgFilter,  
.RadGrid_GridBannered .rgPagePrev,  
.RadGrid_GridBannered .rgPageNext,  
.RadGrid_GridBannered .rgPageFirst,  
.RadGrid_GridBannered .rgPageLast,  
.RadGrid_GridBannered .rgExpand,  
.RadGrid_GridBannered .rgCollapse,  
.RadGrid_GridBannered .rgSortAsc,  
.RadGrid_GridBannered .rgSortDesc,  
.RadGrid_GridBannered .rgUpdate,  
.RadGrid_GridBannered .rgCancel,  
.RadGrid_GridBannered .rgUngroup  
{  
    width:16px;  
    height:16px;  
    border:0;  
    margin:0;  
    padding:0;  
    background-color:transparent;  
    background-image:url('Grid/sprite.gif');  
    background-repeat:no-repeat;  
    vertical-align:middle;  
    font-size:1px;  
    cursor:pointer;  
}  
 
.RadGrid_GridBannered .rgGroupItem input,  
.RadGrid_GridBannered .rgCommandRow img,  
.RadGrid_GridBannered .rgHeader input,  
.RadGrid_GridBannered .rgFilterRow img,  
.RadGrid_GridBannered .rgFilterRow input,  
.RadGrid_GridBannered .rgPager img  
{  
    vertical-align:middle;  
}  
 
/*header*/ 
 
.RadGrid_GridBannered .rgHeaderDiv  
{  
    /*background:#EDB512 0 -5900px repeat-x url('Grid/sprite.gif');*/ 
    background:#EDB512;  
}  
.rgTwoLines .rgHeaderDiv  
{  
    background-position:0 -6200px;  
}  
 
.rgNoScrollImage .rgHeaderDiv  
{  
    background-image:none;  
}  
 
.RadGrid_GridBannered .rgHeader,  
.RadGrid_GridBannered th.rgResizeCol  
{  
    border:0;  
    border:1px solid #d12421;     
    padding-top:5px;  
    padding-bottom:4px;  
    /*background:#ffffff 0 -2300px repeat-x url('Grid/sprite.gif');*/ 
    background:#EDB512;  
    color:#d12421;  
    text-align:left;  
    font-weight:bold;  
}  
 
.RadGrid_GridBannered th.rgSorted  
{  
    background-color:#ffffff;  
    background-position:0 -2600px;  
}  
 
.RadGrid_GridBannered .rgHeader, .RadGrid_GridBannered .rgHeader a  
{  
    color#d12421;  
    text-decorationnone;  
}  
 
.RadGrid_GridBannered .rgCheck  
{  
    height:15px;  
    margin:0;  
    padding:0;  
}  
 
/*rows*/ 
 
.RadGrid_GridBannered .rgRow td,  
.RadGrid_GridBannered .rgAltRow td,  
.RadGrid_GridBannered .rgEditRow td,  
.RadGrid_GridBannered .rgFooter td  
{  
    border:0;  
    /*border-bottom:1px solid;*/ 
    padding-top:4px;  
    padding-bottom:3px;  
}  
 
.RadGrid_GridBannered .rgRow td  
{  
    border-color:#fff;    
}  
 
.RadGrid_GridBannered .rgAltRow  
{  
    background:#fff;      
}  
 
.RadGrid_GridBannered .rgAltRow td  
{  
      
}  
 
.RadGrid_GridBannered .rgRow .rgSorted  
{  
      
}  
 
.RadGrid_GridBannered .rgAltRow .rgSorted  
{  
      
}  
 
.RadGrid_GridBannered .rgSelectedRow .rgSorted,  
.RadGrid_GridBannered .rgActiveRow .rgSorted,  
.RadGrid_GridBannered .rgHoveredRow .rgSorted,  
.RadGrid_GridBannered .rgEditRow .rgSorted  
{  
    background-color:transparent;  
}  
 
.RadGrid_GridBannered .rgRow a,  
.RadGrid_GridBannered .rgAltRow a,  
.RadGrid_GridBannered .rgEditRow a,  
.RadGrid_GridBannered .rgFooter a,  
.RadGrid_GridBannered .rgEditForm a  
{  
    color:#000;  
}  
 
.RadGrid_GridBannered .rgSelectedRow  
{  
    background-color:#EDB512;  
    font-weightbold;  
    color:#d12421;  
}  
*+html .RadGrid_GridBannered .rgSelectedRow .rgSorted{background-color:#EDB512}  
* html .RadGrid_GridBannered .rgSelectedRow .rgSorted{background-color:#EDB512}  
 
.RadGrid_GridBannered .rgSelectedRow a  
{  
    color:#d12421;  
}  
 
.RadGrid_GridBannered .rgActiveRow,  
.RadGrid_GridBannered .rgHoveredRow  
{  
    /*background:#ffffff 0 -2900px repeat-x url('Grid/sprite.gif');*/ 
    background-color:#EDB512;  
    font-weightbold;  
    color:#d12421;  
}  
*+html .RadGrid_GridBannered .rgActiveRow .rgSorted,  
*+html .RadGrid_GridBannered .rgHoveredRow .rgSorted{background-color:#EDB512}  
* html .RadGrid_GridBannered .rgActiveRow .rgSorted,  
* html .RadGrid_GridBannered .rgHoveredRow .rgSorted{background-color:#EDB512}  
 
.RadGrid_GridBannered .rgEditRow  
{  
    background-color:#EDB512;  
    /*background:#fff 0 -4900px repeat-x url('Grid/sprite.gif');*/ 
}  
 
.RadGrid_GridBannered .rgActiveRow td,  
.RadGrid_GridBannered .rgActiveRow td.rgSorted,  
.RadGrid_GridBannered .rgHoveredRow td,  
.RadGrid_GridBannered .rgHoveredRow td.rgSorted  
{  
      
}  
 
.RadGrid_GridBannered .rgSelectedRow td,  
.RadGrid_GridBannered .rgSelectedRow td.rgSorted  
{  
      
}  
 
/*footer*/ 
 
.RadGrid_GridBannered .rgFooterDiv,  
.RadGrid_GridBannered .rgFooter  
{  
    background:#ffffff;  
}  
 
.RadGrid_GridBannered .rgFooter td  
{  
    border-top:1px solid #828282;  
    border-bottom:1px solid #fff;  
}  
 
/*status*/ 
 
.RadGrid_GridBannered .rgPager .rgStatus  
{  
    width:35px;  
    border:1px solid;  
    border-color:#828282 #c9c9c9 #eee #c9c9c9;  
    border-left:0;  
    padding:3px 0 2px;  
}  
 
.RadGrid_GridBannered .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_GridBannered .rgPager  
{  
    background:#eee;  
}  
 
.RadGrid_GridBannered .rgPager td  
{  
    padding:0;  
}  
 
.RadGrid_GridBannered .rgPager .rgPagerCell  
{  
    border:1px solid;  
    border-color:#828282 #eee #eee;  
    border-right:0;  
    padding:5px 0 4px;  
}  
 
.RadGrid_GridBannered .rgWrap  
{  
    float:left;  
    padding:0 10px;  
    line-height:22px;  
    whitewhite-space:nowrap;  
}  
 
.RadGrid_GridBannered .rgArrPart1  
{  
    padding-right:0;  
}  
 
.RadGrid_GridBannered .rgArrPart2  
{  
    padding-left:0;  
}  
 
.RadGrid_GridBannered .rgInfoPart  
{  
    float:rightright;  
    color:#8a8a8a;  
}  
 
.RadGrid_GridBannered .rgInfoPart strong  
{  
    font-weight:normal;  
    color:#4c4e54;  
}  
 
.RadGrid_GridBannered .rgArrPart1 img,  
.RadGrid_GridBannered .rgArrPart2 img  
{  
    margin:0 8px;  
}  
 
.RadGrid_GridBannered .rgPageFirst,  
.RadGrid_GridBannered .rgPagePrev,  
.RadGrid_GridBannered .rgPageNext,  
.RadGrid_GridBannered .rgPageLast  
{  
    width:22px;  
    height:22px;  
    vertical-align:top;  
}  
 
.RadGrid_GridBannered .NextPrev .rgPageFirst,  
.RadGrid_GridBannered .NextPrev .rgPagePrev,  
.RadGrid_GridBannered .NextPrev .rgPageNext,  
.RadGrid_GridBannered .NextPrev .rgPageLast  
{  
    vertical-align:middle;  
}  
 
.RadGrid_GridBannered .rgPageFirst  
{  
    background-position:0 -550px;  
}  
.RadGrid_GridBannered .rgPageFirst:hover  
{  
    background-position:0 -600px;  
}  
.RadGrid_GridBannered .rgPagePrev  
{  
    background-position:0 -700px;  
}  
.RadGrid_GridBannered .rgPagePrev:hover  
{  
    background-position:0 -750px;  
}  
.RadGrid_GridBannered .rgPageNext  
{  
    background-position:0 -850px;  
}  
.RadGrid_GridBannered .rgPageNext:hover  
{  
    background-position:0 -900px;  
}  
.RadGrid_GridBannered .rgPageLast  
{  
    background-position:0 -1000px;  
}  
.RadGrid_GridBannered .rgPageLast:hover  
{  
    background-position:0 -1050px;  
}  
 
.RadGrid_GridBannered .rgPagerButton  
{  
    height:22px;  
    border:1px solid;  
    border-color:#d0d0d0 #aeaeae #8b8b8b;  
    margin:0 14px 0 0;  
    padding:0 4px 2px;  
    background:#e8e8e8 repeat-x 0 -1550px url('Grid/sprite.gif');  
    color:#000;  
    font:12px/12px "segoe ui",arial,sans-serif;  
    vertical-align:middle;  
    cursor:pointer;  
}  
 
.RadGrid_GridBannered .rgNumPart  
{  
    padding:0;  
}  
 
.RadGrid_GridBannered .NumericPages .rgNumPart  
{  
    padding:0 10px;  
}  
 
.RadGrid_GridBannered .rgNumPart a:hover,  
.RadGrid_GridBannered .rgNumPart a:hover span,  
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage,  
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage span  
{  
    background:no-repeat url('Grid/sprite.gif');  
}  
 
.RadGrid_GridBannered .rgNumPart a  
{  
    float:left;  
    line-height:22px;  
    margin:0;  
    padding:0 5px 0 0;  
    color:#000;  
    text-decoration:none;  
}  
 
.RadGrid_GridBannered .rgNumPart span  
{  
    float:left;  
    padding:0 0 0 5px;  
}  
 
.RadGrid_GridBannered .rgNumPart a:hover  
{  
    background-position:100% -1250px;  
}  
 
.RadGrid_GridBannered .rgNumPart a:hover span  
{  
    background-position:0 -1150px;  
    cursor:pointer;  
}  
 
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage,  
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage:hover  
{  
    background-position:100% -1450px;  
    cursor:default;  
}  
 
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage span,  
.RadGrid_GridBannered .rgNumPart a.rgCurrentPage:hover span  
{  
    background-position:0 -1350px;  
    cursor:default;  
}  
 
.RadGrid_GridBannered .NextPrevNumericAndAdvanced .rgAdvPart  
{  
    float:none;  
    text-align:center;  
}  
 
.RadGrid_GridBannered .rgPager .RadSlider  
{  
    float:left;  
    margin:0 10px 0 0;  
}  
 
.RadGrid_GridBannered .rgPagerLabel,  
.RadGrid_GridBannered .rgPager .RadComboBox,  
.RadGrid_GridBannered .rgPager .RadInput_GridBannered  
{  
    margin:0 4px 0 0;  
    vertical-align:middle;  
}  
 
*+html .RadGrid_GridBannered .rgPager .RadComboBox{margin-top:-1px;}  
* html .RadGrid_GridBannered .rgPager .RadComboBox{margin-top:-1px;padding:1px 0;}  
 
.RadGrid_GridBannered .rgPagerTextBox  
{  
    text-align:center;  
}  
 
/*sorting, reordering*/ 
 
.RadGrid_GridBannered .rgHeader .rgSortAsc  
{  
    background-position:3px -248px;  
    height:10px;  
}  
 
.RadGrid_GridBannered .rgHeader .rgSortDesc  
{  
    background-position:3px -198px;  
    height:10px;  
}  
 
.GridReorderTop_GridBannered,  
.GridReorderBottom_GridBannered  
{  
    width:9px !important;  
    height:9px !important;  
    margin-left:-5px;     
}  
 
.GridReorderBottom_GridBannered  
{  
    background-position:0 -50px;  
}  
 
/*filtering*/ 
 
.RadGrid_GridBannered .rgFilterRow  
{  
    background:#ffffff;  
}  
 
.RadGrid_GridBannered .rgFilterRow td  
{  
    border-bottom:1px solid #828282;  
    padding-top:4px;  
    padding-bottom:7px;  
}  
 
.RadGrid_GridBannered .rgFilter  
{  
    width:22px;  
    height:22px;  
    margin:0 0 0 2px;  
    background-position:0 -300px;  
}  
 
.RadGrid_GridBannered .rgFilter:hover  
{  
    background-position:0 -350px;  
}  
 
.RadGrid_GridBannered .rgFilterActive,  
.RadGrid_GridBannered .rgFilterActive:hover  
{  
    background-position:0 -400px;  
}  
 
.RadGrid_GridBannered .rgFilterBox  
{  
    border:1px solid;  
    border-color:#8e8e8e #c9c9c9 #c9c9c9 #8e8e8e;  
    padding:2px 1px 3px;  
    font:12px arial,sans-serif;  
    color:#333;  
    vertical-align:middle;  
}  
 
/*grouping*/ 
 
.RadGrid_GridBannered .rgGroupPanel  
{  
    height:24px;  
    border:0;  
    border-bottom:1px solid #828282;  
    background:#eee 0 -1900px repeat-x url('Grid/sprite.gif');  
}  
 
.RadGrid_GridBannered .rgGroupPanel td  
{  
    border:0;  
    padding:3px 4px;  
}  
 
.RadGrid_GridBannered .rgGroupPanel td td  
{  
    padding:0;  
}  
 
.RadGrid_GridBannered .rgGroupPanel .rgSortAsc  
{  
    background-position:4px -144px;  
}  
 
.RadGrid_GridBannered .rgGroupPanel .rgSortDesc  
{  
    background-position:4px -94px;  
}  
 
.RadGrid_GridBannered .rgUngroup  
{  
    background-position:0 -6998px;  
}  
 
.RadGrid_GridBannered .rgGroupItem  
{  
    border:1px solid;  
    border-color:#c4c4c4 #c4c4c4 #9e9e9e;  
    padding:0 2px 1px 3px;  
    background-color:#ffffff;  
    line-height:20px;  
    font-weight:normal;  
    vertical-align:middle;  
}  
 
.RadGrid_GridBannered .rgMasterTable td.rgGroupCol,  
.RadGrid_GridBannered .rgMasterTable td.rgExpandCol  
{  
 
}  
 
.RadGrid_GridBannered .rgGroupHeader  
{  
    font-size:1.1em;  
    line-height:21px;  
    color:#000;  
}  
 
.RadGrid_GridBannered .rgGroupHeader td  
{  
    border-top:1px solid #828282;  
    border-bottom:1px solid #d9d9d9;  
    padding-top:0;  
    padding-bottom:0;  
}  
 
.RadGrid_GridBannered .rgGroupHeader td.rgGroupCol  
{  
    border-top-color:#828282;  
}  
 
.RadGrid_GridBannered .rgExpand  
{  
    background-position:5px -496px;  
}  
 
.RadGrid_GridBannered .rgCollapse  
{  
    background-position:3px -444px;  
}  
 
.RadGrid_GridBannered .rgGroupHeader td p  
{  
    display:inline;  
    margin:0;  
    padding:0 10px;  
}  
 
.RadGrid_GridBannered .rgGroupHeader td div div  
{  
    top:-0.8em;  
    padding:0 10px;  
}  
 
.RadGrid_GridBannered .rgGroupHeader td div div div  
{  
    top:0;  
    padding:0;  
    border:0;  
}  
 
/*editing*/ 
 
.RadGrid_GridBannered .rgEditForm  
{  
    border-bottom:1px solid #828282;  
}  
 
.RadGrid_GridBannered .rgUpdate  
{  
    background-position:0 -1800px;  
}  
 
.RadGrid_GridBannered .rgCancel  
{  
    background-position:2px -1848px;  
}  
 
/*hierarchy*/ 
 
.RadGrid_GridBannered .rgDetailTable  
{  
    border:1px solid #828282;  
    border-right:0;  
}  
 
/*command row*/ 
 
.RadGrid_GridBannered .rgCommandRow  
{  
    background:#c5c5c5 0 -2099px repeat-x url('Grid/sprite.gif');  
    color:#000;  
}  
 
.RadGrid_GridBannered .rgCommandCell  
{  
    border:1px solid;  
    border-color:#999 #f2f2f2;  
    border-top:0;  
    padding:0;  
}  
 
.RadGrid_GridBannered tfoot .rgCommandCell  
{  
    border-top:1px solid;  
    border-bottom:0;  
}  
 
.RadGrid_GridBannered .rgCommandTable td  
{  
    border:0;  
    padding:3px 7px 4px;  
}  
 
.RadGrid_GridBannered .rgCommandTable  
{  
    border:0;  
    border-top:1px solid #fdfdfd;  
    border-bottom:1px solid #e7e7e7;  
}  
 
.RadGrid_GridBannered .rgCommandRow a  
{  
    color:#000;  
    text-decoration:none;  
}  
 
.RadGrid_GridBannered .rgAdd  
{  
    margin-right:3px;  
    background-position:0 -1650px;  
}  
 
.RadGrid_GridBannered .rgRefresh  
{  
    margin-right:3px;  
    background-position:0 -1600px;  
}  
 
.RadGrid_GridBannered .rgEdit  
{  
    background-position:0 -1700px;  
}  
 
.RadGrid_GridBannered .rgDel  
{  
    background-position:0 -1750px;  
}  
 
/*multirow select*/ 
 
.GridRowSelector_GridBannered  
{  
    background:#4c4e54;  
}  
 
/*row drag n drop*/ 
 
.GridItemDropIndicator_GridBannered  
{  
    border-top:1px dashed #666;  
}  
 
/*tooltip*/ 
 
.GridToolTip_GridBannered  
{  
    border:1px solid #828282;  
    padding:3px;  
    background:#fff;  
    color:#333;  
}  
 
/*rtl*/ 
 
.RadGridRTL_GridBannered .rgHeader,  
.RadGridRTL_GridBannered .rgResizeCol  
{  
    text-align:rightright;  
}  
 
.RadGridRTL_GridBannered .rgPager .rgStatus  
{  
    border-right:0;  
    border-left-width:1px;  
}  
 
.RadGridRTL_GridBannered .rgWrap  
{  
    float:rightright;  
}  
 
.RadGridRTL_GridBannered .rgInfoPart  
{  
    float:left;  
}  
 
.RadGridRTL_GridBannered .rgNumPart  
{  
    width:220px;  
}  
 
.RadGridRTL_GridBannered .rgNumPart a  
{  
    float:rightright;  
}  
 
.RadGridRTL_GridBannered .rgDetailTable  
{  
    border-right:1px solid;  
    border-left:0;  
}  
 

2 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 23 Mar 2010, 12:04 PM
Hi Joe,

RadGrid now registers a base stylesheet:

http://www.telerik.com/help/aspnet-ajax/grdbackwardcompatibility.html

Apart from disabling the base stylesheet, another option is to increase the specificity of your custom CSS rules, e.g. by adding a "div" in front of the respective selector:

div.RadGrid_GridBannered .rgRow td,  
div.RadGrid_GridBannered .rgAltRow td,  
div.RadGrid_GridBannered .rgEditRow td,  
div.RadGrid_GridBannered .rgFooter td  
{  
    border:0;  
    /*border-bottom:1px solid;*/
    padding-top:4px;  
    padding-bottom:3px;  
}

Here is some more information about CSS specificity:

http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx


Best wishes,
Dimo
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.
0
Joe
Top achievements
Rank 1
answered on 24 Mar 2010, 01:12 AM
Thanks Dimo, that did the trick!!
Tags
Grid
Asked by
Joe
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Joe
Top achievements
Rank 1
Share this question
or