hbox should be always at the bottom

Question

I develop a Firefox plugin with popup panel. On the panel I have three elements with a hbox. First and second hbox have a fixed size (20px and 400px). The last element should be always on the bottom and stretched. How can I do this?

Answer 1

Not quite sure what you want to achieve but you can use flex="1" to make sure the element uses up all remaining space and align="end" to align its contents to the bottom:

<vbox flex="1">
  <hbox height="20" style="border: 2px solid red;"><label value="1"/></hbox>
  <hbox height="400" style="border: 2px solid green;"><label value="2"/></hbox>
  <hbox flex="1" align="end" style="border: 2px solid blue;"><label value="3"/></hbox>
</vbox>