RadTabStrip vertical orrientation

10 posts, 0 answers
  1. Abid
    Abid avatar
    9 posts
    Member since:
    Jul 2011

    Posted 28 Jul 2011 Link to this post


    Can i do Intended-vertical-left align tabs like i draw in the attached file..? help required
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 28 Jul 2011 Link to this post

    Hi Abid,

    By using the OuterCssClass and CssClass proprties of the RadTabstrip control along with the right css class selectors you can achieve the desired look. Here is an example how this can be done:
    <style type="text/css">
            .border
            {
                border-bottom: 1px solid grey;
            }
             
            .RadTabStripVertical li.rtsLI .new, .new
            {
                padding-left: 10px !important;
            }
            .RadTabStripVertical li.rtsLI .new1, .new1
            {
                padding-left: 20px !important;
            }
            .RadTabStripVertical li.rtsLI .new2, .new2
            {
                padding-left: 30px !important;
            }
        </style>

    markup:
    <telerik:RadTabStrip ID="Radtabstrip1" runat="server" SelectedIndex="1" Orientation="VerticalLeft">
            <Tabs>
                <telerik:RadTab ImageUrl="VImg/icon_05.gif" Text="Management" CssClass="border">
                </telerik:RadTab>
                <telerik:RadTab ImageUrl="VImg/icon_02.gif" Text="Scheduling" OuterCssClass="new" CssClass="border">
                </telerik:RadTab>
                <telerik:RadTab ImageUrl="VImg/icon_03.gif" Text="Meetings" OuterCssClass="new1" CssClass="border">
                </telerik:RadTab>
                <telerik:RadTab ImageUrl="VImg/icon_04.gif" Text="Briefcase" OuterCssClass="new2" CssClass="border">
                </telerik:RadTab>
                <telerik:RadTab ImageUrl="VImg/icon_01.gif" Text="Settings">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>

    Greetings,
    Kate
    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. Abid
    Abid avatar
    9 posts
    Member since:
    Jul 2011

    Posted 02 Aug 2011 Link to this post

    When i set the TabStrip Orientation to left,  Instead of displaying PageView beside the TabStrip, it displays at bottom.

    Attached below is the image to review. 
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Aug 2011 Link to this post

    Hello Abid,

    Please take a look how this demo is implemented. In case it does not help could you provide the markup so we could try to reproduce the issue that you encounter and help you out with a solution?

    All the best,
    Kate
    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. Abid
    Abid avatar
    9 posts
    Member since:
    Jul 2011

    Posted 03 Aug 2011 Link to this post

    Thank you very much. It really helped me. 
    I need a suggestion, which control is suitable from breadcrum so that when i click on it it will display appropriate tab. 
    attached below is the image.
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 03 Aug 2011 Link to this post

    Hi Abid,

    I would suggest that you use the RadSiteMap control if you need to implement BreadCrumb. Please refer to our on-line demo where BreadCrumb is implemented using the RadSiteMap and RadMenu controls. You can apply the same approach for the RadTabStrip control.

    Regards,
    Kate
    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.

  8. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 03 Aug 2011 Link to this post

    Hello Abid,

    I have just implemented the functionality that you are asking for in this forum. Please refer to the following post for an example of how it can be achieved.

    All the best,
    Kate
    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.

  9. Siroos
    Siroos avatar
    4 posts
    Member since:
    Jan 2013

    Posted 09 Jan 2013 Link to this post

    Hi there...
    I want to Create RadTabStrip in Vertical Orientiaction... How can i do this?
    like the Picture i attach ...
  10. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 14 Jan 2013 Link to this post

    Hi Siroos,

    I reviewed the appearance that you are attempting to get using the RadTabStrip control but currently we only provide support for the horizontal/vertical appearance that is demonstrated on the following on-line demo here.

    Kind regards,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  11. Siroos
    Siroos avatar
    4 posts
    Member since:
    Jan 2013

    Posted 14 Jan 2013 Link to this post

    Hi There... Tanks for Reply...
    I saw this Demo and I wanna Texts be Vertical in Tabstrip That works in popular browsers...
    like the picture i attach in previous Post...
    i tried Your Skin Created for Vertical Tabsrip but it is  Working just in IE...
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017