Hello guys.
I experimenting with Flex Styling, and i came across a alignment issue.
I have two image components inside a HBox, and the HBox inside a Canvas, which in turn is inside the main Application.
<mx:Canvas id="Navigation"
horizontalCenter="0"
bottom="0"
left="0"
right="0"
visible="true"
height="40"
styleName="transparent">
<mx:HBox
styleName="ControlContainer"
horizontalCenter="0"
width="150">
<mx:Image id="left"
source="@Embed(source='left.png')"
left="0"/>
<mx:Image id="right"
source="@Embed(source='right.png')"
right="0"/>
</mx:HBox>
</mx:Canvas>
Custom CSS:
.transparent {
backgroundAlpha: 0.7;
background-color: white;
}
.ControlContainer {
}
Well as you see the i gave the Canvas a with background, and a bit transparency.
But the then there is a HBox, with 150px width, and two images inside him, each image is 40x40, so in this case the HBox would be 150x40 which is nice for what I'm trying to do.
But both images are side by side, and i want the left image aligned to the left side of the HBox, and the right image to the right side.
I've tried text-align
but nothing, my guess is that Flex CSS doesn't behave the same way as CSS focused to HTML.
So how can i do that?
PS: If someone knows some good websites about Flex Styling, Flex CSS or Flex customization, would be great if you leave me a few links in comment.