2013-10-14 70 views
0

我正在尋找一種方式來strips.Generally對準我的弧度標籤我用他們水平對齊這樣的拉德標籤條asp.net:對齊文本垂直使用Telerik的

---\ ---\  ------\ 
One \ |Two\ | Three| 
---- -----  ------ 

但現在我的要求是一樣這個:

O-| 
n |- This is one tab.It occupies the complete div.As in, the space you see below for two and  three. 
e-| 

T 
w 
o 

T 
h 
r 
e 
e 

我如何實現使用rad控件和asp.net?當我設定的方向爲垂直左我結束了這樣的事情

One 
Two 
Three 

我的一些代碼:

<telerik:RadMultiPage ID="radCustInfo" runat="server" SelectedIndex="0" CssClass="outerMultiPage"> 
          <telerik:RadPageView ID="radCustInfoPage" runat="server"> 
           <telerik:RadTabStrip ID="radCustInfoTab" runat="server" MultiPageID="radMultiPageCustInfo" 
            SelectedIndex="0" Orientation="VerticalLeft" Width="30px" Height="150px" Align="Left"> 
            <Tabs> 
             <telerik:RadTab ImageUrl="images/companyTabStrip.gif" Width="30px" height="55px" ></telerik:RadTab>            
             <telerik:RadTab ImageUrl="images/contactsTabStrip.gif" Width="30px" height="60px" ></telerik:RadTab>            
             <telerik:RadTab ImageUrl="images/notesTabStrip.gif" Width="30px" height="50px" ></telerik:RadTab> 
            </Tabs> 
           </telerik:RadTabStrip> 

           <telerik:RadMultiPage runat="server" ID="radMultiPageCustInfo" SelectedIndex="0" CssClass="innerMultiPage"> 
            <telerik:RadPageView runat="server" ID="PageView1" BackColor="White"> 
             <table style="vertical-align:top; height:75px;"> 
              <tr> 
               <td style="vertical-align: top; height: 75px; width:75px;"> 
                <b class="infoTitle">Company:</b><br /> 
                <asp:Literal ID="litCompany" runat="server" /><br /> 
                <asp:HyperLink ID="HyperLink1" runat="server" Text="Edit Customer" Target="_blank" Visible="false" /> 
               </td> 
               <td style="vertical-align: top; height: 100px;"> 
                <div class="divAddress" style="height: 70px"> 
                 <b class="infoTitle">Address:</b><br /> 
                 <asp:Literal ID="litAddress" runat="server" /><br /> 
              </tr> 
             </table>                     
            </telerik:RadPageView> 

...等 我使用的圖像,它看起來並不好。我已經調整了rtsrts rtsll等css,但似乎沒有工作。有人能指出我朝着正確的方向嗎?如果你需要更多的信息,請ask.Thanks

回答

0

嘗試這樣的:

.box_rotate { 
    -moz-transform: rotate(90deg); /* FF3.5+ */ 
     -o-transform: rotate(90deg); /* Opera 10.5 */ 
    -webkit-transform: rotate(90deg); /* Saf3.1+, Chrome */ 
      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083); /* IE6,IE7 */ 
     -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */ 
} 

ASPX:

<telerik:RadTabStrip ID="tab1" runat="server" Orientation="VerticalLeft"> 
      <Tabs> 
       <telerik:RadTab Text="Tab1" runat="server" CssClass="box_rotate"> 
       </telerik:RadTab> 
       <telerik:RadTab Text="Tab2" runat="server" CssClass="box_rotate"> 
       </telerik:RadTab> 
       <telerik:RadTab Text="Tab3" runat="server" CssClass="box_rotate"> 
       </telerik:RadTab> 
       <telerik:RadTab Text="Tab4" runat="server" CssClass="box_rotate"> 
       </telerik:RadTab> 
      </Tabs> 
     </telerik:RadTabStrip>