Forum How do I...?

Header height not flowing content correctly

elvanto
Hi,
I'm stuck on a couple of things

Firstly, trying to get a page's content to flow correctly after the header. I'm using `static(header)` and `content: flow(header)`, but the main page content is in the same position regardless of the amount of content. Basically, if I add more padding padding to the header, it's displaying in front of the normal page content.

Secondly, the @top content is completely ignoring the addition content in the header `<div>Article Author</div>`.

Here's a simple example:
css:
@page {
@top {
content: flow(header);
}
}
header {
flow: static(header);
padding: 1cm;
background-color: #eee;
}

html:
<header>
Article Title
<div>Article Author</div>
</header>
<article>
Lipsum...
</article>

Is there any direction on how I can get the content to always display after the header regardless of how tall it is?
And how do I get `content: flow(header)` to display all of the <header>'s content?
mikeday
The header height is determined by the margin-top property of the @page rule, and won't expand automatically.
elvanto
Thanks mike, that makes sense now!

What about the content `content: flow(header);` & `flow: static(header);`?
Am I doing something wrong or should it only display the `<header>` section and not it's children <div>?
mikeday
I should display the whole content, if the @page margin-top is big enough to hold it.
elvanto
Great thanks, I'll get it working now!