ViewStack not resizing between children

[firdosh]

When I switch from the login state to the search state it shows vert and horz bars for my search state as well even though separately they show up fine


<?xml version="1.0" encoding="utf-8"?>
<!-- Video Search Application -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%" xmlns:local="*">
<mx:Script>
<![CDATA[
private function validateUser(evt:Event):void{
displayStack.selectedChild=search;
}
]]>
</mx:Script>
<mx:ViewStack id="displayStack">
<mx:VBox id="login" width="100%" height="100%">
<local:KCCVideoLoginForm onSubmit="validateUser(event);" />
</mx:VBox>
<mx:VBox width="20%" height="60%" id="search">
<mx:Label text="KCC Video Search" fontSize="18" fontWeight="bold" paddingBottom="20"/>
<mx:HBox width="100%" height="7%">
<mx:Label text="Name : " width="60%" />
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Date File Created : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Size in bytes : " width="60%" />
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Title : " width="60%" />
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Speaker : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Length : " width="60%" />
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Keywords : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Description : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Year : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Copyright : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Company : " width="60%" />
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Krannert Originator : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="7%">
<mx:Label text="Folder : " width="60%"/>
<mx:TextInput />
</mx:HBox>
<mx:HBox width="100%" height="8%" paddingTop="20">
<mx:HBox width="80%" />
<mx:Button label="Submit">
</mx:Button>
</mx:HBox>
</mx:VBox>
</mx:ViewStack>
</mx:Application>



thanks
cheers :)
firdosh

[dr_zeus]

Check out the resizeToContent property.

<mx:ViewStack id="displayStack" resizeToContent="true">