Customize RadGrid CommandItem Row and Cell Styles

Updated on Nov 2, 2026

Environment

Product	Telerik UI for ASP.NET AJAX
Version	2026.3.811

Description

How can I change the background, padding, and borders of a RadGrid CommandItem without modifying the grid markup?

Solution

The CommandItem is rendered as a tr.rgCommandRow element with a td.rgCommandCell child. Override these selectors in the skin that the grid uses.

The following example removes the skin background image, sets the row background color, and customizes the cell spacing and borders:

CSS

.RadGrid_WebBlue .rgCommandRow {
    background-image: none;
    background-color: red;
}

.RadGrid_WebBlue .rgCommandCell {
    padding: 12px 16px;
    background-image: none;
    background-color: white;
    border-top: 0;
    border-right: 0;
    border-bottom: 1px solid #9db6c5;
    border-left: 0;
}

Replace WebBlue with the name of the skin used by your RadGrid. The .rgCommandRow selector applies to command item rows generated by the grid. If CommandItemDisplay is set to TopAndBottom, inspect the rendered HTML before adding an ancestor selector intended to target only one of the command items.

If you customize the CommandItemTemplate, keep these CSS overrides in the grid skin. Declarative changes to the template do not override properties already set by the skin. For the complete styling context, see Styling the CommandItem.

See Also

• CommandItemTemplate
• Modifying Existing Skins