Black skin: how to change some green text to red?

3 posts, 0 answers
  1. Lukasz Kalbarczyk
    Lukasz Kalbarczyk avatar
    24 posts
    Member since:
    Feb 2010

    Posted 23 Mar 2010 Link to this post

    I would like to have any other color than this green. The first text is colored by me, but the others are not. How can I do that with the other texts? Now I have:

    #cont .rfdSelect_Black:hover .rfdSelectOuter,
    #cont .rfdSelectBox_Black li:hover,
    #cont .rfdSelectBox_Black .rfdSelect_selected,
    #cont .RadForm_Black.rfdButton .rfdSkinnedButton:hover *,
    #cont .RadForm_Black fieldset.rfdFieldset legend
    {
        color: Red;
    }


  2. robertw102
    robertw102 avatar
    265 posts
    Member since:
    Jul 2007

    Posted 23 Mar 2010 Link to this post

    Why not try adding the !important keyword next your color property. Like so:

    color: Red !important;

    That way any existing styles will not overwrite it.

    I hope that helps.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Bozhidar
    Admin
    Bozhidar avatar
    678 posts

    Posted 23 Mar 2010 Link to this post

    Hi guys,

    Robert, thank you for your suggestion. I just want to add some additional information on this:

    As I see form the image attached , you would like to style the drop-down list and to define your own colors to be different than the Green in the Telerik skin, that you are using for your project.

    Because the embedded styles from Telerik CSS file are applied after the styles that you specified, in the HTML document, they overwrite your new CSS properties and that`s why they could not be applied.

    The solution should be to put your new CSS properties between the <head></head> tags of your document and to set them the !important rule to make them heavier than the embedded styles.
    Here is an example of the CSS code that you could put in your document. For that example I used colors by my choice that you could change easily .

    .rfdSelectBox_Black, .rfdSelectText
        {
            color: Red !important;
        }
    .rfdSelect_selected
        {
            color: Blue !important;
        }
    .rfdSelectBox_Black li:hover
        {
            color: Aqua !important;
        }

    .rfdSelectBox_Black, .rfdSelectText - styles the unselected and mouse out items.
    .rfdSelect_selected  - styles the selected item when it is clicked.
    .rfdSelectBox_Black li:hover  - styles the on mouse on item.

    Note that you could change that colors as you like. Please, find a screen shot of my example that shows the behavior that you would like to have. You could see all three states that were styled with the above CSS rules. You may also find helpful to take a look at Creating Custom Skins Tutorial at Telerik RadControls Help Site.
     
    All the best,
    Bozhidar Ruzhenov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top