PDA

View Full Version : Basic Tabs



johnsons
9 Mar 2007, 5:15 AM
Does anyone have suggestions to wrap multi word tab heading?

For example:



var tabs = new Ext.TabPanel('tabs1');
tabs.addTab('script', "View Script");
tabs.addTab('singleword', "Single word");
tabs.activate('script');


Is it possible to maintain a consistent tab height and wanted "View Script" to wrap to two lines, and "single word" to not wrap, and have both tabs text vertically align in the middle?

Thanks!
[/img][/code]

tryanDLS
9 Mar 2007, 8:10 AM
First, use Firebug to look at the rendered HTML for the tabs (the tabstrip) . This will give you and idea of what CSS classes are associated to those elements. Then look at tabs.css to see what attributes are applied and what you might tweak. There's definitely a 'white-space:nowrap' that you'll have to change, as well as playing with the text alignment