[flexcoders] how can I get an application to grow as its children gro (example inside)

[gmoniey22]

I have an application which has a tabnavigator with a handful of VBoxes inside 
of it. Those boxes can have dynamic content (which will grow horizontally). The 
only problem is that I can't get the application to grow horizontally as well.

My plan is to have the application grow, and then fire an event to JS with the 
new application size, and have the JS resize the containing div (or swfobject).

Essentially, i dont want to see any horizontal scrollbars. Here is a working 
example:

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; width="100%" 
height="100%" layout="vertical">
        
        <mx:Script>
                <![CDATA[
                        import mx.controls.TextArea;
                        import mx.controls.TextInput;
                        import mx.controls.Label;
                        import mx.containers.FormItem;
                        private function addComponent():void {
                                var formItem:FormItem = new FormItem();
                                formItem.label = "New";
                                var input:TextArea = new TextArea();
                                input.height = 50;
                                formItem.addChild(input);
                                myForm.addChild(formItem);
                        }
                ]]>
        </mx:Script>
        
    <mx:VBox width="100%" height="100%">
                <mx:TabNavigator  width="100%" height="100%">
                    <mx:VBox label="Test" width="100%" height="100%">
                        <mx:Form id="myForm" >                          
                            <mx:FormItem label="Product:" width="100%">
                                <mx:ComboBox width="200"/>
                            </mx:FormItem>
                
                            <mx:FormItem label="User" width="100%">
                                <mx:ComboBox width="200"/>
                            </mx:FormItem>
                                        
                            <mx:FormItem id="innerItem" label="Expandable">
                            </mx:FormItem>
                        </mx:Form>
                    </mx:VBox>
        </mx:TabNavigator>    
                <mx:HBox horizontalAlign="right" verticalAlign="middle" 
width="100%">
                    <mx:Button label="Add component" click="addComponent()"/>
                </mx:HBox>
        </mx:VBox>
</mx:Application>


Thanks!