Constraints are designed to be used to constrain other components for things like alignment and size. For your app, just add a group around each of your containers and you're fine.
-TH <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" backgroundColor="blue"> <s:SkinnableContainer id="mainContentArea" backgroundColor="red" bottom="100" top="100"> <s:layout> <s:ConstraintLayout> <s:constraintColumns> <s:ConstraintColumn id="col1" width="{ width / 2 }" /> <s:ConstraintColumn id="col2" width="{ width / 2 }" /> </s:constraintColumns> </s:ConstraintLayout> </s:layout> <s:Group height="100%" left="col1:0" right="col1:0"> <s:BorderContainer id="greenContainer" width="400" height="300" backgroundColor="green" horizontalCenter="0" verticalCenter="0" /> </s:Group> <s:Group height="100%" left="col2:0" right="col2:0"> <s:BorderContainer id="yellowContainer" width="200" height="150" backgroundColor="yellow" horizontalCenter="0" verticalCenter="0" /> </s:Group> </s:SkinnableContainer> </s:Application> --- In flexcoders@yahoogroups.com, RobertTr <rexdtripod@...> wrote: > > > Here's code that splits the screen into two columns, left and right. Then it > puts a box in each column and attempts to center them. The horizontalCenter > and verticalCenter properties are ignored: > > <?xml version="1.0" encoding="utf-8"?> > <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" > xmlns:s="library://ns.adobe.com/flex/spark" > xmlns:mx="library://ns.adobe.com/flex/mx" > backgroundColor="blue"> > <fx:Declarations> > <!-- Place non-visual elements (e.g., services, value objects) > here --> > </fx:Declarations> > <s:SkinnableContainer id="mainContentArea" > top="100" bottom="100" > backgroundColor="red"> > <s:layout> > <s:ConstraintLayout> > <s:constraintColumns> > <s:ConstraintColumn id="col1" > width="{width/2}" /> > <s:ConstraintColumn id="col2" > width="{width/2}" /> > </s:constraintColumns> > > </s:ConstraintLayout> > </s:layout> > <s:BorderContainer id="greenContainer" > backgroundColor="green" > width="400" height="300" > horizontalCenter="col1:0" > verticalCenter="0"> > </s:BorderContainer> > <s:BorderContainer id="yellowContainer" > backgroundColor="yellow" > width="200" height="150" > horizontalCenter="col2:0" > verticalCenter="0"> > </s:BorderContainer> > </s:SkinnableContainer> > </s:Application> > > -- > View this message in context: > http://old.nabble.com/Why-don%27t-horizontalCenter-and-verticalCenter-work-with-Spark-ColumnConstraints--tp32358020p32358020.html > Sent from the FlexCoders mailing list archive at Nabble.com. >