Hi
I have created a custom skin based on the embedded Windows7 skin (it is only the colors which have changed) which is applied using an ASP.NET theme. In general this works well but I have found one area which is causing problems. The generic CSS rules (i.e. those which are not skin specific) are still taken from the skins DLL (i.e. they come from ...Telerik.Web.UI.WebResource.axd) but they are loaded after the skin specific styles fromn the ASP.NET theme folder. As a result there are situations where a skin specific style designed to override a non-skin specific style does not work.
As an example consider the Calendar control. The non-skin specific calendar CSS file includes the following rule which adds a border to the cells used for each day:
.RadCalendar .rcRow td {
border-style: solid;
border-width: 1px;
padding: 0;
text-align: right;
vertical-align: middle; }
The custom skin calendar CSS file includes the following rule which removes the border:
.RadCalendar_CXTest .rcRow td {
width: 26px;
border: 0;
padding: 0 0 1px 1px;
}
Since these two rules have the same specificity the ordering is important. Unfortunately the non-skin specific file is loaded after the skin specific file and so the non-skin specific rule takes precedence and the calendar days end up with borders.
Is there any way to avoid this?
Thanks
Graham
I have created a custom skin based on the embedded Windows7 skin (it is only the colors which have changed) which is applied using an ASP.NET theme. In general this works well but I have found one area which is causing problems. The generic CSS rules (i.e. those which are not skin specific) are still taken from the skins DLL (i.e. they come from ...Telerik.Web.UI.WebResource.axd) but they are loaded after the skin specific styles fromn the ASP.NET theme folder. As a result there are situations where a skin specific style designed to override a non-skin specific style does not work.
As an example consider the Calendar control. The non-skin specific calendar CSS file includes the following rule which adds a border to the cells used for each day:
.RadCalendar .rcRow td {
border-style: solid;
border-width: 1px;
padding: 0;
text-align: right;
vertical-align: middle; }
The custom skin calendar CSS file includes the following rule which removes the border:
.RadCalendar_CXTest .rcRow td {
width: 26px;
border: 0;
padding: 0 0 1px 1px;
}
Since these two rules have the same specificity the ordering is important. Unfortunately the non-skin specific file is loaded after the skin specific file and so the non-skin specific rule takes precedence and the calendar days end up with borders.
Is there any way to avoid this?
Thanks
Graham