Tab position

5 posts, 1 answers
  1. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 29 Jun 2011 Link to this post

    Hi,
    I'm trying to work out how to get a tab shown to the right with a horizontal sliding zone.  At the moment I have a panel with a search popup panel under it.  Looks good but would look better if the tab button that opens the search panel was on the right hand side rather than the left - the accompanying image shows what I want to achieve...

    Regards,

    Jon
  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3596 posts

    Posted 01 Jul 2011 Link to this post

    Hello Jon,

    I hope I have understood your scenario correctly. If that is the case a simple float: right will suffice to align the element to the right:
        <telerik:RadSplitter runat="server" id="RadSplitter1"  Orientation="Horizontal">
        <telerik:RadPane runat="server" ID="RadPane1">
            <telerik:RadSlidingZone runat="server" ID="RadSlidingZone1" Width="22px" >
                <telerik:RadSlidingPane runat="server" ID="RadSlidingPane1" IconUrl="~/Images/title.jpeg" >
                    <div style="width: 50px; height: 20px; background-color:yellow; float: right;">search</div>
                    <div style="clear: both;"><%--This element is used to clear the other content, depending on your scenario you might not need it--%></div>
                    some other content
                </telerik:RadSlidingPane>
            </telerik:RadSlidingZone>
        </telerik:RadPane>
        <telerik:RadPane runat="server" ID="RadPane2"></telerik:RadPane>
    </telerik:RadSplitter>

    If that is not the case please send us a simple page that isolates your case and some more information on the expected behavior so that we can provide a more accurate answer.


    Greetings,
    Marin
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 01 Jul 2011 Link to this post

    Hi Marin,

    Yeah sorry - you've misunderstood.  The bit the I want to right align is the tab rather than the content.  The tab being button rendered with the Title and IconURL specified in the radslidingpane (as below).

    <telerik:RadSlidingPane ID="Radslidingpane4" Title="Filter Options" runat="server" Height="122px"
    EnableDock="false" EnableResize="false" IconUrl="/Images/Icons/16/zoom.png" BackColor="#888888" >

    Looking at the source it looks like the div with this id: RAD_SLIDING_PANE_TAB_Radslidingpane4 is more or less the one I need to right align.  Is it a case of right aligning the rspPaneTabContainer class?

    Best Regards,

    Jon
  5. Answer
    Marin Bratanov
    Admin
    Marin Bratanov avatar
    3596 posts

    Posted 04 Jul 2011 Link to this post

    Hello Jon,

    I am sorry for misunderstanding your request. Yet the approach is the same - locate the desired element (via Firebug for example)  and float it to the right:

    .rspPaneTabContainer .rspPaneTabContainerExpanded,
    .rspPaneTabContainer
    {
        float: right !important;
    }

    You may also want to cascade this rule to make it more specific so that it affects only the desired sliding zone. The easiest way to do that is to use its parent pane's CssClass property.


    Best wishes,
    Marin
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  6. Jon
    Jon avatar
    813 posts
    Member since:
    Oct 2008

    Posted 06 Jul 2011 Link to this post

    Thanks Marin,

    That was what I was looking for.

    I do try to use the firebug type tools but often find them rather hard to work with as it isn't always clear what the ramifications will be for changing something.  The way my luck works I'd end up causing a nasty cascade onto other pages!

    Regards,

    Jon

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