Basic ordering doesn't work

The children of my collection are listed in title order, not in the specified order.

I have a collection defined by

content:
    items: 
       '@self.children'
order:
    by: header.ref
    dir: asc

The children have a ref variable in the front matter, eg
ref: Ber 1

I want the children listed in order of the ref variable, so my template says:

    {% for child in page.collection %}
        <li>{{ child.header.ref }} :

But the list comes out in title order, not ref order. What's wrong? I'm stuck.

Ooops. Mucked up my yaml. Fixed now. Apologies for time-wasting!