RadSplitter custom skin...

7 posts, 0 answers
  1. Alexander Kotchkin
    Alexander Kotchkin avatar
    23 posts
    Member since:
    Sep 2009

    Posted 19 Sep 2009 Link to this post

    I was able to create a new skin for a RadSplitter Control, everything works fine, except when I tried to change the size of the text that shows in the SlidingZone Tabs.  I was able to change the font color but the font size doesn't change.
    Am I doing something wrong?

    I have the 2009 trial version, and I'm deciding wether to buy the developer version or not, and this issue is affecting my decision.

    I'll appreciate your help with this.

    Regards,

    Jesus.
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 21 Sep 2009 Link to this post

    Hello Jesus,

    You can try out the following css style setting to set the font size of the sliding zone tabs of your splitter control:
    css:
     .RadSplitter .rspPaneTabText 
        { 
          font-size : 15px !important; 
          color:Red !important; 
        } 

    Thanks
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 23 Sep 2009 Link to this post

    Hi Jesus,
    You can either use important as Princy suggested, or you can increase the specificity of your CSS selectors. For example:
    .RadSplitter .rspPaneTabContainer .rspPaneTabText 
        font-size15px
        color: Red; 


    Regards,
    Tsvetie
    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.
  5. LUDOVIC
    LUDOVIC avatar
    4 posts
    Member since:
    Sep 2012

    Posted 12 Mar 2013 Link to this post

    Perfect!
    but just an additional question : how to identify specific splitter to apply new style when you have several splitter in the same page ?

    regards

  6. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 13 Mar 2013 Link to this post

    Hello,

    If you are setting the CSS as Tsvetie suggested, it will be applicable to all the RadSplitter controls in your page. If you want to style a particular RadSplitter only, you should specify the ID along with the CSS class. Please have a look into the sample CSS.

    CSS:
    #RadSplitter1.RadSplitter .rspPaneTabContainer .rspPaneTabText
    {
        font-size: 15px !important;
        color: Red !important;
    }

    Thanks,
    Princy.
  7. LUDOVIC
    LUDOVIC avatar
    4 posts
    Member since:
    Sep 2012

    Posted 13 Mar 2013 Link to this post

    thank for your quick answer!

    my previous request was not really clear: actually I have one radsplitte with 2 RadSlidingPane and this is this sliding panes I would lkike to customize specifically. to have for instance the left one with bold and color red attribute and the right one no bold and green.

    thank a lot
  8. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 14 Mar 2013 Link to this post

    Hello,

    Please have a look into the following code to give different style to SlidingPanel content.

    ASPX:
    <telerik:RadSlidingZone ID="Radslidingzone2" runat="server" Height="22px" SlideDirection="Bottom">
        <telerik:RadSlidingPane ID="Radslidingpane1" Title="Pane1" runat="server" Height="150px">
            Pane1</telerik:RadSlidingPane>
        <telerik:RadSlidingPane ID="Radslidingpane2" Title="Pane2" runat="server" Height="150px">
            Pane2</telerik:RadSlidingPane>
    </telerik:RadSlidingZone>

    CSS:
    <style type="text/css">
        #RAD_SLIDING_PANE_CONTENT_Radslidingpane1.rspSlideContent
        {
            color: red;
            font-weight: bold;
        }
        #RAD_SLIDING_PANE_CONTENT_Radslidingpane2.rspSlideContent
        {
            color: Green;
            font-weight: normal;
        }
    </style>

    Thanks,
    Princy.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017