How to vertically align all HGroups in application to "middle"?

In my application all HGroups should be vertically aligned to middle. As this is a property of HorizontalLayout which is exposed via HGroup's verticalAlign property (not style) I can't set it in CSS. Also, while Groups are not skinnable I can't assign a custom skin.

Is creating a subclass like VerticallyAlignedHGroup my开发者_如何转开发 only option or is there a better way?

I've run across this as well and after some research wound up doing as you mentioned and created my own subclass of HGroup that had verticalAlign set to "middle". Wish I had a better solution for you, but I've been unable to find one.

Borek,

Normally you can only apply vertical alignment using the CSS property verical-align to table elements (th, td). However...

If you're using DIVs then just fake it using table-cell display. You will have to wrap up your .verticallyAlignedHGroup in a parent DIV so you can declare its display as table though.

#verticalWrapper { display: table; }
.verticalAlignHGroup { display: table-cell; vertical-align: middle; }

The HTML would look something like this

<div id="verticalWrapper"> <!-- display: table -->
  <div class="verticalAlignHGroup"> <!-- display: table-cell; vertical-align: middle -->
    Some content
  </div>
  <div class="verticalAlignHGroup"> <!-- display: table-cell; vertical-align: middle -->
    Some content
  </div>
</div>

Hope that helps.