¿What's the best approach to use Skins and CSS simultanously in a RadControl, and specifically in RadGrid? I would like to use the features provided from Skins but I need to customize some specific aspects, for example: ItemStyle, AlternatingItemStyle, FooterStyle, HeaderStyle, and so on, with no losing Skins capabilities.
Thanks in advance
Thanks in advance
4 Answers, 1 is accepted
0
Wveimar
Top achievements
Rank 1
answered on 31 Aug 2009, 04:05 PM
Additional info: It is important to be able to use a separate CSS file to define custom appearance items. Not the same CSS file included within the Skin.
0
Wveimar
Top achievements
Rank 1
answered on 31 Aug 2009, 08:06 PM
I found a way to define styling features that override styling defined inside a Skin. The key is use the keyword "!important" inside the CSS.
Now i have a problem defining styling to a RadGrid, and specifically its ItemStyle, AlternatingItemStyle, HeaderStyle, FooterStyle, and so on. In the HeaderStyle everything works fine, but the others don't apply features like font-family, font-size and color. This a code snippet showing what i'm trying to accomplish:
If the previous styles is applied to a ItemStyle or AlternatingItemStyle, the font-family, font-size, border-color, border-width and color doesn't works fine.
| .GridFilterItemStyle |
| { |
| background: Navy !important; |
| } |
Now i have a problem defining styling to a RadGrid, and specifically its ItemStyle, AlternatingItemStyle, HeaderStyle, FooterStyle, and so on. In the HeaderStyle everything works fine, but the others don't apply features like font-family, font-size and color. This a code snippet showing what i'm trying to accomplish:
| .GrigHeaderStyle |
| { |
| background: Navy !important; |
| font-style: italic !important; |
| font-weight: bold !important; |
| font-family: Verdana !important; |
| font-size: 12px !important; |
| border-color: Orange !important; |
| border-width: 1px !important; |
| color: Green !important; |
| } |
If the previous styles is applied to a ItemStyle or AlternatingItemStyle, the font-family, font-size, border-color, border-width and color doesn't works fine.
0
Wveimar
Top achievements
Rank 1
answered on 02 Sep 2009, 10:16 PM
¿Can anybody help me on this issue? I don't know what to do to get the desired result.
0
Hello Wveimar,
!important is not required, you can use CSS rules with higher specificity instead:
http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx
If some of your custom CSS styles are not applied, please use Firebug to troubleshoot the page's HTML output and all registered styles.
All the best,
Dimo
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
!important is not required, you can use CSS rules with higher specificity instead:
http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx
If some of your custom CSS styles are not applied, please use Firebug to troubleshoot the page's HTML output and all registered styles.
All the best,
Dimo
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
