custom css for tabstrip

5 posts, 0 answers
  1. kmv
    kmv avatar
    53 posts
    Member since:
    Apr 2008

    Posted 04 Jun 2009 Link to this post

    i want to make a tabstrip with very small tabs, which i guess means reducing the padding in the tabstrip common css file , but then that will affect all tabstrips (will it?)

    so i guess then i need to rename all the classes in the common tabstrip css file but how do i tell tabstrip to use all my new classes ?


    thanks
    kevin
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 05 Jun 2009 Link to this post

    Hello Kevin,

    You can set the css class for the tab as shown below to reduce the size for a particular TabStrip:
    aspx:
      <telerik:RadTabStrip ID="RadTabStrip1" CssClass="Tab"   runat="server" > 
             <Tabs>      
                 <telerik:RadTab Text="Text1" runat="server">              
                 </telerik:RadTab>            
                 <telerik:RadTab Text="Text2" runat="server"
                 </telerik:RadTab> 
                 <telerik:RadTab Text="Text3" runat="server"
                 </telerik:RadTab> 
                 <telerik:RadTab Text="Text4" runat="server"
                 </telerik:RadTab> 
             </Tabs> 
            </telerik:RadTabStrip> 

    css:
    <style type="text/css">     
     
         .Tab .rtsIn {padding:0px !important;}   
       
    </style> 

    Thanks
    Princy.
  3. kmv
    kmv avatar
    53 posts
    Member since:
    Apr 2008

    Posted 05 Jun 2009 Link to this post

    hi there


    thanks for that ...  but wont that set the padding for all the tabstrips on the page rather than just the one i want with small tabs ?



    kevin
  4. kmv
    kmv avatar
    53 posts
    Member since:
    Apr 2008

    Posted 05 Jun 2009 Link to this post

    hi princy


    ok i see the Tab class makes sure it only applies to my one tabstrip ?

    actually the css needs to be :

    <style type="text/css">                    
            .Tab .rtsOut {padding-right:2px !important;}
            .Tab .rtsLink {padding-left:2px !important;}
    </style>


    thanks
    kevin




  5. vamshi
    vamshi avatar
    1 posts
    Member since:
    Mar 2018

    Posted 29 Mar 2018 in reply to kmv Link to this post

    Is there any way to add custom class name to  <kendo-tabstrip-tab [title]="Home" [selected]="true">

    Thanks in advance

Back to Top