Tabpanel width

  1. #1

    Tabpanel width



    When I use a TabPanel without Width attribute specified or use AutoWidth="True"/"False" my TabPanel has crazy width (5000px). My page uses html tables for layout. Is it possible to make the TabPanel occupy just 100% of the containing cell and not break the layout with some weird width?

    Thank you!

    PS. The only workaround I found is:
    <ext:Panel>
        <Content>
            <ext:BorderLayout>
                <Center>
                    <ext:TabPanel>
                        <Tabs>
                            <ext:Tab>
                                <Content />
                            </ext:Tab>
                        </Tabs>
                    </ext:TabPanel>
                </Center>
            </ext:BorderLayout>
        </Content>
    </ext:Panel>
    But this is kinda ugly: having to wrap TabPanel into a bunch of other containers just to get normal width. Any suggestions?
  2. #2

    RE: Tabpanel width

    Hi haltenberg,

    The following forum post goes in depth into several work-arounds for this issue, see http://forums.ext.net/showthread.php?postid=746.aspx

    I think for you're situation adding the simple css class to your TabPanel, as demonstrated in the post/attachment above, will fix the problem.

    The best fix... try to avoid the use of <table>'s for structured layout. The only really weird issues I've run into involve the <ext:TabPanel>, but the post above should provide any necessary work-arounds.

    Hope this helps.
    Geoffrey McGill
    Founder & CEO
  3. #3

    RE: Tabpanel width



    Thank you Geoffrey! This explains a lot!

    Unfortunately I'm adding a new functionality to an existing inhouse project, otherwise I wouldn't be using tables. Hopefully I would be able to find time and redo the whole damn thing from a scratch, but it's a beast :)
  4. #4

    RE: Tabpanel width

    Thanks for the update.

    The Toolkit and ExtJS are so flexible that working around these issues is always possible, but it's just a matter of narrowing down the problem to find the root cause. ExtJS was never really designed to work in a old-school <table> layout, although in the end just adding one custom css style is a pretty painless fix.

    Keep me updated and let us know if you run into any "issues".
    Geoffrey McGill
    Founder & CEO
  5. #5

    RE: Tabpanel width



    Thanks Geoffrey!
    The thing I would really like to have is ability to hook up server-side handlers to Window's hide event :) But as you have already told me, this is not currently possible.
  6. #6

    RE: Tabpanel width

    I'm working on a server-side Window close event solution. I'll keep you updated with the progress.
    Geoffrey McGill
    Founder & CEO

Similar Threads

  1. Replies: 1
    Last Post: Jun 04, 2012, 3:48 PM
  2. [CLOSED] Width of title in TabPanel
    By skisly in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 29, 2011, 1:43 PM
  3. [CLOSED] ext:TabPanel: width
    By RomualdAwessou in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 15, 2010, 6:22 PM
  4. Replies: 6
    Last Post: Jun 11, 2010, 12:47 PM
  5. Replies: 4
    Last Post: Aug 04, 2009, 11:37 AM

Posting Permissions