Each item can specify its position and size via the "pos" node.
For example:
<pos x="0" y="4" width="100%" height="100%"/>
Both position and size can be given in percent and it will be taken
as the percentage of the size of the current container.  For toplevel
items it's the percentage of the whole screen.
For x and y, you can also specify a negative position which means
position from the right or bottom edge.  But this only applies with
absolute coordinates.  With percentage you can specify negative
position and it will be still from the same edge.
The position also specifies the anchor of the item, this can be
"n", "ne", "e", "se", "s", "sw", "w" and "nw" or "center" which stand
for the different edges/corners or "center" for center.  For example:
<pos x="10%" y="50%" anchor="w" width="80%" height="95"/>
If the item contains a box, you can specify width and height to be
"box" to mean that they are supposed to be the width and height of
the box, that is the items in the box plus the padding.
If the item contains an SVG image, you can specify width and height
to be "scale" to mean that the SVG image should be scaled to fit
the requested area.
You can also specify an "expand" property to either be "true" or
false.  If true then the child will be expanded in the box as much
as possible (that is it will be given more space if available).
There are two extra properties you can specify (as of 2.4.4.3) for
labels (and labels only).  The first is "max-width" which will
specify the maximum width of the label in pixels.  And the second is
"max-screen-percent-width" which specifies the maximum percentage of
the screen width that the label can occupy.  By default no label will
occupy more then 90% of the screen by width.  An example may be:
<item type="label">
<pos x="10%" max-screen-percent-width="50%"/>
