Here is my CSS file:
/* Telerik RadGrid APRDefault Skin */
/*global*/
.RadGrid_APRDefault
{
background:white;
color:#000000;
scrollbar-face-color:#E9E9E9;
scrollbar-highlight-color:#fff;
scrollbar-shadow-color:#E9E9E9;
scrollbar-3dlight-color:#DBDBDB;
scrollbar-arrow-color:#787878;
scrollbar-track-color:#F5F5F5;
scrollbar-darkshadow-color:#AEAEAE;
}
.RadGrid_APRDefault
,
.MasterTable_APRDefault
,
.DetailTable_APRDefault
,
.GroupPanel_APRDefault
table,
.GridEditForm_APRDefault
table
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
border: solid 1px #999999;
}
.MasterTable_APRDefault
{
border-collapse:collapse;
background-color: #000066;
}
.RadGrid
{
border-collapse:collapse;
background-color: #000066;
border: solid 1px #999999;
}
.GridRow_APRDefault
td,
.GridAltRow_APRDefault
td,
.GridEditRow_APRDefault
td,
.GridFooter_APRDefault
td,
.GridGroupFooter_APRDefault
td,
.GridFilterRow_APRDefault
td,
.GroupHeader_APRDefault
td,
.GridHeader_APRDefault
,
.ResizeHeader_APRDefault
{
padding-left:3px;
padding-right:3px;
border-right: solid 1px #999999;
}
.RadGrid_APRDefault
.rgAdd,
.RadGrid_APRDefault
.rgRefresh,
.RadGrid_APRDefault
.rgEdit,
.RadGrid_APRDefault
.rgDel,
.RadGrid_APRDefault
.rgFilter,
.RadGrid_APRDefault
.rgPagePrev,
.RadGrid_APRDefault
.rgPageNext,
.RadGrid_APRDefault
.rgExpand,
.RadGrid_APRDefault
.rgCollapse,
.RadGrid_APRDefault
.rgSortAsc,
.RadGrid_APRDefault
.rgSortDesc,
.RadGrid_APRDefault
.rgUpdate,
.RadGrid_APRDefault
.rgCancel
{
width:16px;
height:16px;
border:0;
padding:0;
background-color:transparent;
background-image:url('Grid/sprite.gif');
background-repeat:no-repeat;
vertical-align:middle;
cursor:pointer;
}
.GroupPanelItems_APRDefault
input,
.GridCommandRow_APRDefault
img,
.GridHeader_APRDefault
input,
.GridFilterRow_APRDefault
img,
.GridPager_APRDefault
img
{
vertical-align:middle;
}
/*header*/
.GridHeaderDiv_APRDefault
{
width: 100%;
/* margin-right: 15px; */
padding-right: 22px;
background-color: #000066;
}
.GridHeaderDiv_APRDefault
table
{
width: 100%;
}
.GridDataDiv_APRDefault
table
{
}
.GridHeader_APRDefault
,
.ResizeHeader_APRDefault
{
padding-top:6px;
padding-bottom:6px;
background:#ececec url('Grid/sprite.gif') 0 0 repeat-x;
text-align: center;
}
.GridHeader_APRDefault
a
{
color: White;
text-decoration: underline;
}
/*rows*/
.GridRow_APRDefault
td,
.GridAltRow_APRDefault
td,
.GridEditRow_APRDefault
td,
.GridFooter_APRDefault
td,
.GridGroupFooter_APRDefault
td
{
padding-top:5px;
padding-bottom:5px;
}
.GridRow_APRDefault
td,
.GridAltRow_APRDefault
td,
.GridFooter_APRDefault
td,
.GridGroupFooter_APRDefault
td
{
}
.GridRow_APRDefault
a,
.GridAltRow_APRDefault
a,
.GridEditRow_APRDefault
a,
.GridFooter_APRDefault
a,
.GridGroupFooter_APRDefault
a,
.GridEditForm_APRDefault
a
{
color:#000;
}
.GridAltRow_APRDefault
{
background-color: #cfd1e9;
}
.GridRow_APRDefault
{
background-color: #e3e4f2;
}
.SelectedRow_APRDefault
{
background:#008A8C;
}
.SelectedRow_APRDefault
td
{
}
.GridRowOver_APRDefault
,
.ActiveRow_APRDefault
{
background:#fff;
}
.GridEditRow_APRDefault
{
background:#ffffe1;
}
.GridEditRow_APRDefault
td
{
}
/*footer*/
.GridFooterDiv_APRDefault
,
.GridFooter_APRDefault
,
.GridGroupFooter_APRDefault
{
background:#CCCCCC;
color:#000;
}
/*status*/
.GridPager_APRDefault
span
{
color:#999;
}
/*pager*/
.GridPager_APRDefault
{
background:#fff;
color:#666;
line-height:22px;
}
.GridPager_APRDefault
td
{
padding:2px 4px;
}
.GridPager_APRDefault
div span,
.GridPager_APRDefault
a,
.GridPager_APRDefault
.sliderPagerLabel_APRDefault
{
color:#666;
}
.GridPager_APRDefault
a:hover
{
color:#000;
}
.PagerLeft_APRDefault
{
float:left;
}
.PagerRight_APRDefault
{
float:right;
}
.PagerCenter_APRDefault
{
text-align:center;
}
.PagerCenter_APRDefault
span
{
vertical-align:middle;
}
.RadGrid_APRDefault
.rgPagePrev
{
background-position:3px -727px;
}
.RadGrid_APRDefault
.rgPageNext
{
background-position:5px -759px;
}
/*sorting, reordering*/
.GridHeader_APRDefault
.rgSortAsc
{
background-position:-21px -630px;
height:10px;
}
.GridHeader_APRDefault
.rgSortDesc
{
background-position:4px -629px;
height:10px;
}
.TopReorderIndicator_APRDefault
,
.BottomReorderIndicator_APRDefault
{
width:11px !important;
height:11px !important;
margin-left:-5px;
background:url('Grid/sprite.gif') 0 -600px no-repeat;
}
.BottomReorderIndicator_APRDefault
{
background-position:-21px -600px;
}
/*filtering*/
.GridFilterRow_APRDefault
{
background:#fcfcfc;
}
.GridFilterRow_APRDefault
td
{
padding-top:4px;
padding-bottom:4px;
}
.RadGrid_APRDefault
.rgFilter
{
background-position:2px -789px;
}
.GridFilterRow_APRDefault
input[type="text"]
{
padding:2px;
font:11px arial,sans-serif;
color:#424242;
vertical-align:middle;
}
/*grouping*/
.GroupPanel_APRDefault
{
background:#e5e5e5;
}
.GroupPanel_APRDefault
.rgSortAsc
{
background-position:-21px -627px;
}
.GroupPanel_APRDefault
.rgSortDesc
{
background-position:4px -626px;
}
.GroupPanel_APRDefault
td
{
padding:2px 3px;
}
.GroupPanel_APRDefault
td td
{
padding:1px;
}
.GroupPanelItems_APRDefault
{
padding:1px 2px 1px 5px;
background:#efefef;
color:#999;
white-space:nowrap;
}
.GroupHeader_APRDefault
{
background:#fff;
}
.GroupHeader_APRDefault
td
{
padding-top:5px;
padding-bottom:5px;
}
.RadGrid_APRDefault
.rgExpand
{
background-position:2px -822px;
}
.RadGrid_APRDefault
.rgCollapse
{
background-position:2px -854px;
}
.GroupHeader_APRDefault
td div
{
top:-0.6em;
}
.GroupHeader_APRDefault
td div div
{
top:0;
}
/*editing*/
.GridEditForm_APRDefault
{
}
.GridEditForm_APRDefault
input[type="text"],
.GridEditForm_APRDefault
input[type="password"],
.GridEditForm_APRDefault
textarea
{
padding:2px;
font:11px arial,sans-serif;
color:#424242;
}
.RadGrid_APRDefault
.rgUpdate
{
background-position:2px -981px;
}
.RadGrid_APRDefault
.rgCancel
{
background-position:2px -1013px;
}
/*hierarchy*/
.DetailTable_APRDefault
{
}
/*command row*/
.GridCommandRow_APRDefault
{
background:#f3f3f3;
}
.GridCommandRow_APRDefault
a
{
color:#000;
}
.RadGrid_APRDefault
.rgAdd
{
background-position:2px -1046px;
}
.RadGrid_APRDefault
.rgRefresh
{
background-position:5px -885px;
}
.RadGrid_APRDefault
.rgEdit
{
background-position:2px -918px;
}
.RadGrid_APRDefault
.rgDel
{
background-position:2px -951px;
}
/*multirow select*/
.GridRowSelector_APRDefault
{
background:#669 !important;
}
/*row drag n drop*/
.GridItemDropIndicator_APRDefault
{
}
/*rtl*/
.RadGridRTL_APRDefault
.GridHeader_APRDefault,
.RadGridRTL_APRDefault
.ResizeHeader_APRDefault
{
text-align:right;
}
.RadGridRTL_APRDefault
.PagerLeft_APRDefault,
.RadGridRTL_APRDefault
.GridPager_APRDefault .radslider
{
float:right;
}
.RadGridRTL_APRDefault
.PagerRight_APRDefault
{
float:left;
}
and here is my HTML
<div id="divBatchListSection" style="margin-left: 5px; margin-right: 7px; margin-top: 10px;">
<telerik:RadGrid ID="dtgManageBatchList" runat="server" GridLines="Vertical" Width="100%"
Height="130px" AutoGenerateColumns="False" ShowStatusBar="True" DataSourceID="dtsBatchList" EnableEmbeddedSkins="False" Skin="APRDefault">
<MasterTableView DataSourceID="dtsBatchList" AllowSorting="True">
<RowIndicatorColumn>
<HeaderStyle Width="20px" />
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px" />
</ExpandCollapseColumn>
<Columns>
<telerik:GridTemplateColumn UniqueName="colSelected" >
<ItemTemplate>
<asp:CheckBox ID="Selected" />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="BatchName" HeaderText="Batch Name" SortExpression="BatchName" UniqueName="BatchName">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="OriginalFileName" HeaderText="Original File" SortExpression="OriginalFileName" UniqueName="OriginalFileName">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="CreatedBy" HeaderText="Created By" SortExpression="CreatedBy" UniqueName="CreatedBy">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="CreatedDate" DataType="System.DateTime" HeaderText="Created Date" SortExpression="CreatedDate" UniqueName="CreatedDate">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="ValidRecords" DataType="System.Int32" HeaderText="Valid Records" ReadOnly="True" SortExpression="ValidRecords" UniqueName="ValidRecords">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="InvalidRecords" DataType="System.Int32" HeaderText="Invalid Records" ReadOnly="True" SortExpression="InvalidRecords" UniqueName="InvalidRecords">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="TotalRecords" DataType="System.Int32" HeaderText="Total Records" ReadOnly="True" SortExpression="TotalRecords" UniqueName="TotalRecords">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn DataField="CorrectedRecords" DataType="System.Int32" HeaderText="Corrected Records" ReadOnly="True" SortExpression="CorrectedRecords" UniqueName="CorrectedRecords">
</telerik:GridBoundColumn>
</Columns>
<EditFormSettings>
<EditColumn CancelImageUrl="Cancel.gif" EditImageUrl="Edit.gif" InsertImageUrl="Update.gif" UpdateImageUrl="Update.gif">
</EditColumn>
</EditFormSettings>
</MasterTableView>
<ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">
<Selecting AllowRowSelect="True" />
<Scrolling AllowScroll="True" UseStaticHeaders="True" />
</ClientSettings>
<FilterMenu EnableTheming="True">
<CollapseAnimation Duration="200" Type="OutQuint" />
</FilterMenu>
</telerik:RadGrid>
<asp:SqlDataSource ID="dtsBatchList" runat="server" ConnectionString="<%$ ConnectionStrings:APRWebDBConnectionString3 %>" SelectCommand="SELECT * FROM [vwBatches_Active]"></asp:SqlDataSource>
</div>
Is there another skin I should use as a default that is more compatible? If not, do you have any idea how I could make this compatible with all three browsers?