States in a custom component

Question

I am having a problem getting my states to view correctly from a custom component.
I call in the custom component that has states in it, and they do not view correctly.
Here is an example:
The states from my custom component:
<mx:states>
        <mx:State name="state1">
            <mx:RemoveChild target="{formitem3}"/>
            <mx:RemoveChild target="{hbox4}"/>
            <mx:RemoveChild target="{vbox1}"/>
            <mx:RemoveChild target="{panel24}"/>
            <mx:AddChild relativeTo="{hbox3}" position="before">
                <components:SensitivityValue2 variableString="Capital Cost Multiplier" unitsString="" close="currentState=''"/>
            </mx:AddChild>
            <mx:RemoveChild target="{button31}"/>
        </mx:State>
        <mx:State name="state2">
            <mx:RemoveChild target="{formitem3}"/>
            <mx:RemoveChild target="{hbox4}"/>
            <mx:RemoveChild target="{vbox1}"/>
            <mx:RemoveChild target="{panel24}"/>
            <mx:AddChild relativeTo="{hbox5}" position="before">
                <components:SensitivityValue2 variableString="Replacement Cost Multiplier" unitsString="" close="currentState=''"/>
            </mx:AddChild>           
            <mx:RemoveChild target="{button1}"/>
        </mx:State>
and here is how I am calling in the custom component to my main application:
<components:MyCustomComp id="customComp" width="100%" height="100%" label="CustomComp"/>

Answer 1

when you switch to a state (by click a button) it should just move some icons down and
insert a panel.
And when you switch back it should just move everything back up and remove the panel.
What does happen is nothing, or an error, or it adds the panel to a strange location.