TabStrip width for VerticalLeft limited to 150px

2 posts, 0 answers
  1. Tom
    Tom avatar
    17 posts
    Member since:
    Jan 2009

    Posted 19 Jan 2009 Link to this post

    (I was asking this question in a thread in the ASP.Net TabStrip forum, but thought I should move it here...)

    I'm using the AJAX-Enabled ASP.NET RadTabStrip in a vertical left orientation, and the width is limited to 150px.  I tried applying a style recommended in the other forum (see the head tag in the code below) but the width still maxes out at 150px.

    My test page is very simple:
    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="RadTabStrip Width Test.aspx.vb" Inherits="AJAXEnabledWebApplication1.RadTabStrip_Width_Test" %> 
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> 
    <html xmlns="" > 
    <head runat="server">  
        <title>Untitled Page</title> 
        <style type="text/css">  
            .RadTabStripLeft .rtsLevel,  
            .RadTabStripRight .rtsLevel,  
            .RadTabStripLeft .rtsLevel .rtsUL,  
            .RadTabStripRight .rtsLevel .rtsUL  
                  width: 100% !important;  
        <form id="form1" runat="server">  
            <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
            <div style="width: 500px">  
                <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Width="100%" Orientation="VerticalLeft">  
                        <telerik:RadTab runat="server" Text="First tab">  
                        <telerik:RadTab runat="server" Text="This is a very very long tab name">  

    Any tips to get this working?  When I examine the generated page I see that rtsUL has its width set to 150px.


  2. Serrin
    Serrin avatar
    286 posts
    Member since:
    Sep 2008

    Posted 20 Jan 2009 Link to this post

    Hey Tom,

    You'll want to try something like this:

    .RadTabStripLeft_Default .rtsLevel .rtsUL,  
    .RadTabStripRight_Default .rtsLevel .rtsUL  
            width: 100% !important;   

    Buuuuut...  This makes the tab sized based on the length of content, which means you'll end up with tabs that are like this:

    -  Tab 1         -  
    - Super Long Tab Two Here    -  

    But if you set a specific pixel length (width: 250px !important), you get tabs that are all the same width.
Back to Top