I have tried the css as always to give some borders to my grid columns and removed the last columns right borders because I didn't need them. I have tried to use the css class='rgHeader LeftBorder' in HeaderStyle tag of those coulmns but it doesn't remove the header border. Please help me as soon as possible. My codes are:
div.RadGridCustomClass .rgHeader,
div.RadGridCustomClass th.rgResizeCol,
div.RadGridCustomClass .rgFooter td,
div.RadGridCustomClass .rgFilterRow td {
border-left: 1px solid #f0f0f0 !important;
border-right: 1px solid #f0f0f0 !important;
}
div.RadGridCustomClass .rgMasterTable{
font-family: Calibri !important;
font-size: 11pt;
}
div.RadGridCustomClass .rgMasterTable .rgHeader{
font-family: Calibri !important;
font-size: 11pt;
font-weight: bold;
}
div.RadGridCustomClass .rgAltRow td {
border-bottom: 0px !important;
}
div.RadGridCustomClass .rgMasterTable,
div.RadGridCustomClass {
border: 0px !important;
}
div.RadGridCustomClass .rgMasterTable td {
border-right: 1px solid #f0f0f0 !important;
}
div.RadGridCustomClass .rgMasterTable:last-child,
div.RadGridCustomClass td:last-child {
border: 0px !important;
}
div.RadGridCustomClass th.LeftBorder,
div.RadGridCustomClass .rgRow td.LeftBorder,
div.RadGridCustomClass .rgAltRow td.LeftBorder,
div.RadGridCustomClass .rgEditRow td.LeftBorder
{
border-right-width:0px !important;
}
<telerik:RadGrid ID="ToolkitSections" runat="server" AutoGenerateColumns="False" OnNeedDataSource="ToolkitSectionsNeedDataSource" OnItemDataBound="ToolkitSections_ItemDataBound" OnUpdateCommand="ToolkitSections_UpdateCommand" CellSpacing="-1" OnItemCreated="ToolkitSections_ItemCreated" AllowSorting="True" CssClass="RadGridCustomClass" Font-Names="Calibri" EnableViewState="False" OnPreRender="ToolkitSections_PreRender" Width="90%">
<MasterTableView DataKeyNames="ToolkitSectionID,Progress,SectionDenied,Status,Restricted" EditMode="InPlace" ClientDataKeyNames="ToolkitSectionID" >
<RowIndicatorColumn Visible="False">
</RowIndicatorColumn> <ExpandCollapseColumn Created="True">
</ExpandCollapseColumn> <Columns>
<telerik:GridHyperLinkColumn AllowFiltering="False" DataNavigateUrlFields="SectionUrl" DataTextField="SectionName" FilterControlAltText="Filter SectionUrl column" Groupable="False" HeaderText="Section" Reorderable="False" Resizable="False" SortExpression="Section Name" UniqueName="SectionUrl">
<HeaderStyle ForeColor="white" CssClass="headerfont"></HeaderStyle>
</telerik:GridHyperLinkColumn>
<telerik:GridDateTimeColumn AllowFiltering="False" DataField="LastModified" DataFormatString="{0:MM/dd/yyyy}" FilterControlAltText="Filter Last Modified column" Groupable="False" HeaderText="Modified" Reorderable="False" Resizable="False" UniqueName="LastModified" ReadOnly="True">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" CssClass="RightBorder"></HeaderStyle>
</telerik:GridDateTimeColumn>
<telerik:GridCheckBoxColumn AllowFiltering="False" DataField="Complete" DataType="System.Boolean" FilterControlAltText="Filter Complete column" Groupable="False" HeaderText="Complete" Reorderable="False" Resizable="False" UniqueName="Complete" ReadOnly="True">
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridCheckBoxColumn> <telerik:GridTemplateColumn UniqueName="Restricted" HeaderText="Restrict" FilterControlAltText="Filter Restricted column" Reorderable="False" Resizable="False" ShowSortIcon="False">
<ItemTemplate>
<div>
<div style="float: left">
<asp:CheckBox ID="cbRistrict" runat="server" AutoPostBack="true" OnCheckedChanged="cbRistrict_OnCheckedChanged" onclientclick="this.checked=true;"></asp:CheckBox>
</div>
<div style="float: left">
<asp:LinkButton ID="RestrictLinkButton" runat="server" BorderWidth="0"><img style="text-decoration:none;border:0px;" src="~/Images/Lock-Restricted.png" runat="server"/></asp:LinkButton>
</div>
</div>
</ItemTemplate>
<HeaderStyle ForeColor="white" ></HeaderStyle> </telerik:GridTemplateColumn> <telerik:GridDateTimeColumn AllowFiltering="False" DataField="SectionDueDate" DataFormatString="{0:MM/dd/yyyy}" FilterControlAltText="Filter Section Due Date column" Groupable="False" HeaderText="Section Due Date" Reorderable="False" Resizable="False" UniqueName="SectionDueDate">
<HeaderStyle Width="120px" HorizontalAlign="Right" CssClass="rgHeader LeftBorder"></HeaderStyle>
<ItemStyle Width="80" HorizontalAlign="Center" CssClass="LeftBorder"></ItemStyle>
<ColumnValidationSettings>
<ModelErrorMessage Text="" /> </ColumnValidationSettings>
<HeaderStyle ForeColor="white"></HeaderStyle>
</telerik:GridDateTimeColumn>
<telerik:GridEditCommandColumn ButtonType="ImageButton" EditImageUrl="~/Images/date-icon.png" UniqueName="EditCommandColumn" ItemStyle-HorizontalAlign="Left" Reorderable="False" Resizable="False" ShowFilterIcon="False" ShowSortIcon="False">
<HeaderStyle ForeColor="white" Width="10px" CssClass="rgHeader LeftBorder"></HeaderStyle>
<ItemStyle HorizontalAlign="Left" CssClass="LeftBorder" /> </telerik:GridEditCommandColumn> <telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="ToolkitSectionID" Groupable="False" HeaderText="ToolkitSection ID" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="ToolkitSectionID" ReadOnly="true" Display="False">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="Progress" FilterControlAltText="Filter Progress column" Groupable="False" HeaderText="Progress" Reorderable="False" Resizable="False" UniqueName="Progress" ReadOnly="True" DataType="System.Int16" Display="False" ShowSortIcon="False">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn> <telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="SectionDenied" Display="False" FilterControlAltText="Filter Section Denied column" Groupable="False" HeaderText="Section Denied" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="SectionDenied">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="AnybodyDenied" Display="False" FilterControlAltText="Filter Section Denied column" Groupable="False" HeaderText="Section Denied" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="AnybodyDenied">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" CssClass="headerfont"></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="Status" Display="False" FilterControlAltText="Filter Status Column" Groupable="False" HeaderText="Status" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="Status">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn> </Columns> <EditFormSettings>
<EditColumn UniqueName="EditCommandColumn" ButtonType="ImageButton" CancelImageUrl="~/RadControls/Grid/Skins/Default/Cancel.gif" UpdateImageUrl="~/RadControls/Grid/Skins/Default/Update.gif">
</EditColumn>
</EditFormSettings>
</MasterTableView>
</telerik:RadGrid>
div.RadGridCustomClass .rgHeader,
div.RadGridCustomClass th.rgResizeCol,
div.RadGridCustomClass .rgFooter td,
div.RadGridCustomClass .rgFilterRow td {
border-left: 1px solid #f0f0f0 !important;
border-right: 1px solid #f0f0f0 !important;
}
div.RadGridCustomClass .rgMasterTable{
font-family: Calibri !important;
font-size: 11pt;
}
div.RadGridCustomClass .rgMasterTable .rgHeader{
font-family: Calibri !important;
font-size: 11pt;
font-weight: bold;
}
div.RadGridCustomClass .rgAltRow td {
border-bottom: 0px !important;
}
div.RadGridCustomClass .rgMasterTable,
div.RadGridCustomClass {
border: 0px !important;
}
div.RadGridCustomClass .rgMasterTable td {
border-right: 1px solid #f0f0f0 !important;
}
div.RadGridCustomClass .rgMasterTable:last-child,
div.RadGridCustomClass td:last-child {
border: 0px !important;
}
div.RadGridCustomClass th.LeftBorder,
div.RadGridCustomClass .rgRow td.LeftBorder,
div.RadGridCustomClass .rgAltRow td.LeftBorder,
div.RadGridCustomClass .rgEditRow td.LeftBorder
{
border-right-width:0px !important;
}
<telerik:RadGrid ID="ToolkitSections" runat="server" AutoGenerateColumns="False" OnNeedDataSource="ToolkitSectionsNeedDataSource" OnItemDataBound="ToolkitSections_ItemDataBound" OnUpdateCommand="ToolkitSections_UpdateCommand" CellSpacing="-1" OnItemCreated="ToolkitSections_ItemCreated" AllowSorting="True" CssClass="RadGridCustomClass" Font-Names="Calibri" EnableViewState="False" OnPreRender="ToolkitSections_PreRender" Width="90%">
<MasterTableView DataKeyNames="ToolkitSectionID,Progress,SectionDenied,Status,Restricted" EditMode="InPlace" ClientDataKeyNames="ToolkitSectionID" >
<RowIndicatorColumn Visible="False">
</RowIndicatorColumn> <ExpandCollapseColumn Created="True">
</ExpandCollapseColumn> <Columns>
<telerik:GridHyperLinkColumn AllowFiltering="False" DataNavigateUrlFields="SectionUrl" DataTextField="SectionName" FilterControlAltText="Filter SectionUrl column" Groupable="False" HeaderText="Section" Reorderable="False" Resizable="False" SortExpression="Section Name" UniqueName="SectionUrl">
<HeaderStyle ForeColor="white" CssClass="headerfont"></HeaderStyle>
</telerik:GridHyperLinkColumn>
<telerik:GridDateTimeColumn AllowFiltering="False" DataField="LastModified" DataFormatString="{0:MM/dd/yyyy}" FilterControlAltText="Filter Last Modified column" Groupable="False" HeaderText="Modified" Reorderable="False" Resizable="False" UniqueName="LastModified" ReadOnly="True">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" CssClass="RightBorder"></HeaderStyle>
</telerik:GridDateTimeColumn>
<telerik:GridCheckBoxColumn AllowFiltering="False" DataField="Complete" DataType="System.Boolean" FilterControlAltText="Filter Complete column" Groupable="False" HeaderText="Complete" Reorderable="False" Resizable="False" UniqueName="Complete" ReadOnly="True">
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridCheckBoxColumn> <telerik:GridTemplateColumn UniqueName="Restricted" HeaderText="Restrict" FilterControlAltText="Filter Restricted column" Reorderable="False" Resizable="False" ShowSortIcon="False">
<ItemTemplate>
<div>
<div style="float: left">
<asp:CheckBox ID="cbRistrict" runat="server" AutoPostBack="true" OnCheckedChanged="cbRistrict_OnCheckedChanged" onclientclick="this.checked=true;"></asp:CheckBox>
</div>
<div style="float: left">
<asp:LinkButton ID="RestrictLinkButton" runat="server" BorderWidth="0"><img style="text-decoration:none;border:0px;" src="~/Images/Lock-Restricted.png" runat="server"/></asp:LinkButton>
</div>
</div>
</ItemTemplate>
<HeaderStyle ForeColor="white" ></HeaderStyle> </telerik:GridTemplateColumn> <telerik:GridDateTimeColumn AllowFiltering="False" DataField="SectionDueDate" DataFormatString="{0:MM/dd/yyyy}" FilterControlAltText="Filter Section Due Date column" Groupable="False" HeaderText="Section Due Date" Reorderable="False" Resizable="False" UniqueName="SectionDueDate">
<HeaderStyle Width="120px" HorizontalAlign="Right" CssClass="rgHeader LeftBorder"></HeaderStyle>
<ItemStyle Width="80" HorizontalAlign="Center" CssClass="LeftBorder"></ItemStyle>
<ColumnValidationSettings>
<ModelErrorMessage Text="" /> </ColumnValidationSettings>
<HeaderStyle ForeColor="white"></HeaderStyle>
</telerik:GridDateTimeColumn>
<telerik:GridEditCommandColumn ButtonType="ImageButton" EditImageUrl="~/Images/date-icon.png" UniqueName="EditCommandColumn" ItemStyle-HorizontalAlign="Left" Reorderable="False" Resizable="False" ShowFilterIcon="False" ShowSortIcon="False">
<HeaderStyle ForeColor="white" Width="10px" CssClass="rgHeader LeftBorder"></HeaderStyle>
<ItemStyle HorizontalAlign="Left" CssClass="LeftBorder" /> </telerik:GridEditCommandColumn> <telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="ToolkitSectionID" Groupable="False" HeaderText="ToolkitSection ID" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="ToolkitSectionID" ReadOnly="true" Display="False">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="Progress" FilterControlAltText="Filter Progress column" Groupable="False" HeaderText="Progress" Reorderable="False" Resizable="False" UniqueName="Progress" ReadOnly="True" DataType="System.Int16" Display="False" ShowSortIcon="False">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn> <telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="SectionDenied" Display="False" FilterControlAltText="Filter Section Denied column" Groupable="False" HeaderText="Section Denied" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="SectionDenied">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="AnybodyDenied" Display="False" FilterControlAltText="Filter Section Denied column" Groupable="False" HeaderText="Section Denied" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="AnybodyDenied">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" CssClass="headerfont"></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn AllowFiltering="False" AllowSorting="False" DataField="Status" Display="False" FilterControlAltText="Filter Status Column" Groupable="False" HeaderText="Status" ReadOnly="True" Reorderable="False" Resizable="False" ShowSortIcon="False" UniqueName="Status">
<ColumnValidationSettings>
<ModelErrorMessage Text="" />
</ColumnValidationSettings>
<HeaderStyle ForeColor="white" ></HeaderStyle>
</telerik:GridBoundColumn> </Columns> <EditFormSettings>
<EditColumn UniqueName="EditCommandColumn" ButtonType="ImageButton" CancelImageUrl="~/RadControls/Grid/Skins/Default/Cancel.gif" UpdateImageUrl="~/RadControls/Grid/Skins/Default/Update.gif">
</EditColumn>
</EditFormSettings>
</MasterTableView>
</telerik:RadGrid>