positioning:

# initialise at 0,0 of the parent viewport
Need to do:
1) move relative to parent viewport - 4 sides
2) move relative to a sibling (i.e next to 'foo' +/- margin)

%vp(id, how, [margin])
 where:
    id = sibling id to align with (or - for parent)
    how is 'left-of', 'right-of' 'above' 'below' 'inside' or similar
    margin is how many pixels to offset, 0 for default


Sizing is more difficult.
 Needs to:
1) size relative to the parent viewport
2) size relative to a sibling
3) size to some other tag (i.e string length, or indent size)

%vs(axis, what, [margin])

axis - 'width' or 'height'
what is either a sibling name, - for the parent, or a tag (%sl())
margin is percentage or pixels to size, 0px/100% being default


full example.

%sl(a) = length of the text a
%Lx(b) - list indent count, b is the pixels per indent
%lh - line (font) height

%V(0,0,-,-,1)           # full viewport
%vc(item)               # child viewport to size each item, initialed to 0,0 of the parent
%vs(height, %lh, 120%)  # make the item 120% font height, 10% height border
%vs(width, -)           # make it the full width of the viewport
#
%vc(indent)             # indent child viewport (if needed)
%vp(item, inside, 0, 0) # position at the (0,0) of the 'item' child vp
%vs(width, %Lx(8))      # Make it the indent width
#
%vc(image)              # image child viewport
%vp(indent, right-of)   # put next to the indent child
%vs(height, item)       # copy 'item' sibling height
%vs(width, 20)          # 20 pixels wide
%Li                     # list item "icon"
#
%vc(text)               # child for the text
%vs(height, %lh, 100%)  # set to line height
%vp(image, right-of)    # put next to the image viewport
%vp(item, vcenter)      # vertically center inside the item child
%Lt                     # Text for the line item