PDA

View Full Version : TabPanel title textAlign



keckeroo
10 Feb 2012, 3:13 PM
How do i get the text in a tab to be LEFT aligned and not centered ?

The config option for tabs 'textAlign' does not seem to 'drip down' or 'percolate up' when trying to configure the tabpanel using items list.



{ xtype: 'tabpanel',
minTabWidth: 150,
tabWidth: 150,
resizeTabs: true,
enableTabScroll: true,
plain: true,
items: [{
title: 'Tab 1',
textAlign: 'left',
html: 'blah'
}]
}


'Tab 1' is centered in the tab - I'm trying to get it left justified.

Thanks.

Kev

Farish
11 Feb 2012, 1:07 AM
I have 4.0.2a and ext-all-debug.js doesnt seem to have textAlign or setTextAlign in the code!

Romick
13 Feb 2012, 5:26 AM
Why not simply do it in css?
Inspect with FireFox exact element and modify.

keckeroo
13 Feb 2012, 8:18 AM
Element has a style of 'x-tab-center' :-S

That's the problem. There's no way of setting it to 'x-tab-left' or 'x-tab-right' using config options. Docs suggest that a 'Tab' itself has the config option of 'textAlign'. That should be honoured for configuring the alignment of text in the tab.

Kev

skirtle
13 Feb 2012, 9:13 AM
The section 'Controlling Tabs' suggests that you should be able to do it using tabConfig:

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.tab.Panel

However, there's no guarantee that it'll work even if you do get the CSS class to change. The textAlign option is inherited from the button class so the CSS rules may not have been implemented for tabs. It should be fairly simple to write them though.

Daniil
6 Aug 2013, 8:18 PM
Just for references. Here is an open bug.
http://www.sencha.com/forum/showthread.php?180657