left tabs orientation

I have a tabbar set to left orientation so that my tab headers appear on the left. I want to increase the tab header width so that the tabs will show all of my text in each tab header. Do I have to do this using css?

The height of the tabs can be set in the 3rd paramater of the tabbar constructor:

tabbar=new dhtmlXTabBar(“a_tabbar”,“left”,height);

But in this case default images can not be used. You should create own tabs images.

Also you can place images instead of the text as the tabs content.


Thanks, that did adjust the width of my left sided tabs, but how do I align the text within the tab vertically in the middle of each tab?  Also, if you run the code below, the outline of each tab only goes so far, and does not reach the edge of the container?

    ol_tabbar=new dhtmlXTabBar(“tabBarDiv”,“left”,“80px”);
    ol_tabbar.setImagePath("…/…/dhtmlxTabbar/imgs/");
    ol_tabbar.addTab(“tab_general”, “General”, “30px”);
    ol_tabbar.addTab(“tab_details”, “Details”, “30px”);
    ol_tabbar.addTab(“tab_terms”, “Terms”, “30px”);
    ol_tabbar.addTab(“tab_printouts”, “Print Outs”, “30px”);
    ol_tabbar.addTab(“tab_tasks”, “Tasks”, “30px”);
    ol_tabbar.addTab(“tab_documents”, “Documents”, “30px”);
    ol_tabbar.addTab(“tab_rolessharing”, “Roles Sharing”, “30px”);
    ol_tabbar.addTab(“tab_history”, “History”, “30px”);

    ol_tabbar.setContent(“tab_general”,“orderLineGridDiv”);
    ol_tabbar.enableScroll(false);
    ol_tabbar.setTabActive(“tab_general”, true);

but how do I align the text within the tab vertically in the middle of each tab?

You can use one of the following approaches to show text vertically: <o:p></o:p>


<o:p></o:p>1) You can try to use some image as
a tab:<o:p></o:p>



    ol_tabbar.addTab(“tab_details”, “<img
…>
”, “100px”);
<o:p></o:p>


2) or place container with width
1px and necessary letters with space between them inside
it:<o:p></o:p>



ol_tabbar.addTab(“tab_details”, “

D E T A I L E
S
”, “100px”);   



The following approach will work only for
IE:<o:p></o:p>



ol_tabbar.addTab(“tab_details”, “

D E T A I L E
S
”, “100px”); 



>> Also, if you run the code below, the outline of each tab only goes so far, and does not reach the edge of the container?  



Tab’s text is placed in the center of the tabs (dhtmlxtabbar.css):

.dhx_tab_element{
    font-family:Tahoma;
    font-size:8pt;
    text-align:center;
    cursor:pointer;
    position:absolute;
    overflow:hidden;
}






please see attached image for further explanation of the problems I am having.  Thanks


Tabs lines have width 38 px . So you should changed them. The ismages are in the folder codebase/imgs/left/: p_left.gif,p_right.gif,a_left.gif,a_right.gif

The position of the text can be changed by using html:

 ol_tabbar.addTab(“tab_general”, “

General
”, “30px”);