I'm trying to add a custom skin to my site and I'm having some issues. I used the theme builder to modify the Silk skin. In my webapp, I added global settings to web.config to set the skin and EnableEmbeddedSkins = false. The site uses ASPNET themes, so I put all the custom CSS files in the App_Themes Theme folder. For all the controls it looks like it applied fine.
It also appears to have applied to the Grid, but I have this obnoxious black border around all my grids. If I inspect the element in the browser, it looks like .RadGrid from WebResource.axd is overriding the custom .RadGrid_ADEMGreen style, because I can uncheck the border from that class and the custom one is applied correctly. I've attached a snapshot of this from the dev tools.
If this is the case, what else is being overridden by the embedded styles? How do I fix this?
2 Answers, 1 is accepted
Rank 1
After further investigation, it looks like the custom style is not being applied properly at all to the Grid, not just the border. I globally set the RenderMode to Lightweight so that isn't the problem.
I read in another thread that that the stylesheets are loaded first, so the embedded styles from Web Resources overrides those and it was recommended to change the order of specificity using RadStylesheetManager. But why? I put all the styles in the Themes folder as instructed in the documentation.
You can use the RadStylesheetManager to specify the order in which styles are loaded. For that you can use the OrderIndex property. This way you can ensure that the custom styles are loaded after the base ones. Thus, the appearance you have defined would be applied.
Regards,
Viktor Tachev
Telerik by Progress