[flexcoders] nested containers, forcing inner contents to scroll

[Derrick Anderson]

hi everyone,

i have a few parts of my app where there are composite components that
create their own children, when i use an accordion for example (but it
happens in many places), and create the children with script- the container
holding the accordion scrolls, not the accordion children themselves- for
example:

<mx:Panel width="100%">
<mx:Accordion id="questionAccordion" width="100%" height="100%">

    </mx:Accordion>
</mx:Panel>

i'm expecting the accordion to take up the full available space in the
panel.

then i add children to the accordion

private function init():void
            {
                for(var i:Number=0;i<page.questions.length;i++){
                    var q1:Question = new Question();
                    q1.question = page.questions[i];
                    q1.editable = editable;
                    q1.percentWidth = 100;
                    questionAccordion.addChild(q1);
                }
            }

what happens is the bottom of the accordion is now cut off and u have to
scroll the panel to see it, because the created childrens' contents are
taller than the viewable area.  I want the accordion to take up 100% height
like i told it and the inner contents of the accordion to scroll if they are
too tall.  i hope that all made sense, it's really frustrating and kinda
hard to explain.

thanks,
d.