Center a group of content vertically?

Archived
1

I have what seems like a simple problem but I haven’t been able to get it to work like I want. I’m trying to style an item component in a RowList. It has an image on the left and on the right is a chunk of content that I would like to center vertically within the component. How can I do that?

Here’s a diagram of it:

My current markup is something like this:

<LayoutGroup layoutDirection="horiz"
    itemSpacings="[51]">
    <Poster id="poster" width="926" height="521"/>

    <LayoutGroup layoutDirection="vert">
        <Label id="headline"
            width="563"
            wrap="true"
            numLines="4"
            lineSpacing="0"/>
        <Label ... />
        <Label ... />
        ...
    </LayoutGroup>
</LayoutGroup>

I’ve tried playing the vertAlignment on the outer and inner LayoutGroups but to no avail. Can anyone help me out here?

Thanks,

tim

2

The solution is to center the layout group in its parent by setting its transformation and also set its vertAlignment or horzAlignment to center.