I have an h1 that's defining my chapter starts. I have defined breaks for the h1s:

h1 {
  page-break-before: always;
}

All is good: http://cl.ly/image/2p3G0o1D2H15

So now I'm trying to avoid having page numbers on those chapter pages, so I name the page:

h1 {
  page-break-before: always;
  page: chapterstart;
}

And now all of a sudden there's a page break after: http://cl.ly/image/0U370J1K3V3q

I've tried to add

page-create-after: avoid

, but it didn't change anything.

What am I doing wrong?

Changing named pages always causes a page break. At the moment the way to do this is by making the entire chapter use a named page, and then select the first page of the chapter:

@page chapter:first { }

You will also need to apply "prince-page-group: start" to the chapter, so that the named page group resets at the beginning of each chapter.

Would I need to set the page for an h1 being a chapter, or does it automatically know this?

ie

h1 {
  page: chapter;
}

Actually you will need to wrap the entire chapter in an element, eg.

<div class="chapter">
<h1>Chapter Heading</h1>
...
</div>

Then apply the styling to the div.

I'm trying this on the beginning pages. I wrapped them all in

<div class="intro">...</div>

and added:

@page .intro {
  @top-left {
    content: "";
  }

  @bottom-left {
    content: "";
  }

  @bottom-center {
    content: "";
  }
}

And nothing changed. Did i misinterpret it?

Unfortunately you need the extra level of indirection of creating a named page group, like this:

.intro { page: intro }

@page intro { ... }

The selectors to match elements can't be used with @page rules.