Change tab color

7 posts, 1 answers
  1. CarlosCisneros
    CarlosCisneros avatar
    24 posts
    Member since:
    Jul 2008

    Posted 11 Sep 2008 Link to this post

    Hi.

    I'm using a tab strip with Office 2007 skin and i need to change the color of one tab when there's been an error on one field inside the tab. how could i do this.

    thanks in advanced.
  2. -DJ-
    -DJ- avatar
    263 posts
    Member since:
    Oct 2004

    Posted 15 Sep 2008 Link to this post

    Hi Carlos,

    You can probably just set a specific css class for the tab where you override the default tab look.

    Regards,
    -DJ-
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Answer
    Paul
    Admin
    Paul avatar
    4281 posts

    Posted 16 Sep 2008 Link to this post

    Hello Carlos,

    The RadTab class expose the following properties that can be used to apply certain CSS classes to the tabs:

    • CssClass - it is always applied regardless the tab state.
    • DisabledCssClass - it is applied when the tab is disabled (Enabled = false).
    • SelectedCssClass - it is applied when the tab is selected.
    • HoveredCssClass - it is applied when the tab is hovered with the mouse.
    Each of the above properties determines the CSS class to be applied to the tab when it is in the respective mode (normal, disabled, selected and hovered). For details on the matter please refer to our Custom CSS Classes and Unique Tab Appearance examples.

    Best wishes,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Christopher Blickley
    Christopher Blickley avatar
    202 posts
    Member since:
    Jan 2004

    Posted 02 Oct 2008 Link to this post

    Paul,

    Is there anyway to get the CSS class applied to an individual tab to work along with the Skin?  Applying a CSS class to the tab works, but only when the Skin on the entire tabstrib is set to "".

    What I would like to do is use a skin, but then change one element, like the text color when I need to draw the users attention to a particular tab.

    When the skin is set, the CSSClass property of the tab has no effect, neither does setting the ForeColor property of the tab.

    Thanks,
    Chris
  6. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 06 Oct 2008 Link to this post

    Hello Christopher,

    In order to achieve your goal you will have to use the !important clause.

    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <title>Untitled Page</title> 
        <style type="text/css">  
        .myCustomClass  
        {    
            color: red !important;  
        }  
     
        </style> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
            <asp:ScriptManager ID="ScriptManager1" runat="server">  
            </asp:ScriptManager> 
            <telerik:RadTabStrip ID="tbMain" runat="server">  
                <Tabs> 
                    <telerik:RadTab runat="server" Text="Root RadTab1">  
                    </telerik:RadTab> 
                    <telerik:RadTab runat="server" Text="Root RadTab2" CssClass="myCustomClass">  
                    </telerik:RadTab> 
                    <telerik:RadTab runat="server" Text="Root RadTab3">  
                    </telerik:RadTab> 
                </Tabs> 
            </telerik:RadTabStrip> 
        </form> 
    </body> 
    </html> 


    Sincerely yours,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Ranganath
    Ranganath avatar
    38 posts
    Member since:
    Jun 2008

    Posted 17 Oct 2008 Link to this post

    Hi,
    Even i tried with u r solution,even though no use.
    can u guide me another ways to Fix tabColors?

    Ranganath
  8. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 17 Oct 2008 Link to this post

    Hello Ranganath,

    It will be best if you can open a support ticket and send us a simple running project (incl. your custom skin, CSS, images, DB backup if needed and so on) demonstrating the problem (and step-by-step instructions on doing so). In that way we can reproduce and pinpoint the problems you're facing on our side, understand the logic of your application and provide a solution.

    Thanks beforehand for your patience and cooperation,
    Paul
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017