I assume you wanted them lined up horizontally next to each other but vertically, hehe if that maks any sense.

What about something like this:

<?xml version="1.0" encoding="utf-8"?>

<mx:Application

xmlns:mx="http://www.adobe.com/2006/mxml"

backgroundColor="0xFFFFFF"

width="310" height="250"

borderStyle="inset"

layout="absolute" viewSourceURL="srcview_b/index.html">

<mx:Style>

@font-face{

src: local("Arial");

fontFamily: "embededFont";

}

Label {

font-family: embededFont;

}

</mx:Style>

<mx:Script>

<![CDATA[

private function rotateHBox():void

{

hboxRotate.rotation = 90;

hboxRotate.x = hboxRotate.height;

}

]]>

</mx:Script>

<mx:HBox id="hboxRotate" creationComplete="rotateHBox()"

x="20" backgroundColor="0×555555"

borderStyle="inset">

<mx:HBox id="hbox1"

borderStyle="inset">

<mx:Label

text="First Label" />

</mx:HBox>

<mx:HBox id="hbox2"

borderStyle="inset">

<mx:Label

text="Second Label that is very long" />

</mx:HBox>

<mx:HBox id="hbox3"

borderStyle="inset">

<mx:Label

text="Third Label"/>

</mx:HBox>

</mx:HBox>

</mx:Application>

Is this what you're looking for? I am simply rotating a VBox by 90 degrees in the other direction (270):

<mx:VBox rotation="270" x="690" y="215">

<mx:Label text="First Label" />

<mx:Label text="Second Label" />

<mx:Label text="Third Label" />

</mx:VBox>

Just try adding some 'paddingTop' to each of the Labels. E.g:

<mx:HBox x="10" y="10" width="400" height="150">

<mx:Label text="First Longer Label" rotation="90" x="0" y="0" paddingTop="-30" />

<mx:Label text="Second Label" rotation="90" x="0" y="0" paddingTop="40" />

<mx:Label text="Third Label" rotation="90" width="87" height="55" x="0" y="0" paddingTop="90" />

</mx:HBox>

Requires a bit of tweaking depending on the text in the label but could probably be done dynamically with a little actionscript.

Yeah, I figured that is what you meant, but I was wondering why you were using an HBox then, but glad someone figured it out ;).