Eliminating border around sub-grid area

[Richard]

I have a Radgrid with a detail table (a sub-grid).  The sub-grid rows always have a border around them (see the attached image) and I would like to eliminate the top and bottom lines.

I have already tried setting BorderStyle="None" and BorderWidth="0" on both the main grid and the detail table, but that has not changed anything.

How would I accomplish this?

[Doncho]

Hi Richard,

I would suggest you use custom CSS to modify the default appearance. You can use the DevTools of the Browser to inspect the Html elements on the page and the applied styles to define an appropriate CSS selector for overriding the built-in skin styles. The first two points in the Improve Your Debugging Skills with Chrome DevTools blog post may help you with that.

The Telerik controls are rendered on the page with certain predefined class names that you can use to style the desired piece.

For instance, here is a CSS you can try for removing the border around the DetailTable(s):

html body .RadGrid .rgDetailTable{
    border:none;
}

I hope this will help you achieve the desired.

Please let me know if further questions come up.

Kind regards,
Doncho
Progress Telerik